{"action":"created","issue":{"url":"https://api.github.com/repos/angular/angular-cli/issues/49","labels_url":"https://api.github.com/repos/angular/angular-cli/issues/49/labels{/name}","comments_url":"https://api.github.com/repos/angular/angular-cli/issues/49/comments","events_url":"https://api.github.com/repos/angular/angular-cli/issues/49/events","html_url":"https://github.com/angular/angular-cli/issues/49","id":113004297,"number":49,"title":"Proposal: integrating efforts","user":{"login":"dsebastien","id":89887,"avatar_url":"https://avatars.githubusercontent.com/u/89887?v=3","gravatar_id":"","url":"https://api.github.com/users/dsebastien","html_url":"https://github.com/dsebastien","followers_url":"https://api.github.com/users/dsebastien/followers","following_url":"https://api.github.com/users/dsebastien/following{/other_user}","gists_url":"https://api.github.com/users/dsebastien/gists{/gist_id}","starred_url":"https://api.github.com/users/dsebastien/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/dsebastien/subscriptions","organizations_url":"https://api.github.com/users/dsebastien/orgs","repos_url":"https://api.github.com/users/dsebastien/repos","events_url":"https://api.github.com/users/dsebastien/events{/privacy}","received_events_url":"https://api.github.com/users/dsebastien/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"milestone":null,"comments":6,"created_at":"2015-10-23T11:47:09Z","updated_at":"2015-12-27T16:04:29Z","closed_at":null,"body":"Hello,\r\n\r\nI've seen @IgorMinar 's presentation of angular-cli & @pkozlowski-opensource talk about ES2015, modules, System, JSPM etc while at AngularConnect in London and found the idea of Angular CLI to be pretty similar to 2 small projects I have created recently:\r\n* https://github.com/dsebastien/modernWebDevBuild\r\n* https://github.com/dsebastien/modernWebDevGenerator\r\n\r\nSince @IgorMinar mentioned that community participation was welcomed, here I go! :)\r\n\r\nI don't know how far you guys are willing to go with Angular CLI and how prescriptive you want to be, but maybe some ideas below would be worth discussing.\r\n\r\nHere's an overview of my projects:\r\n\r\nModernWebDevBuild is based on Google's Web Starter Kit (heavily tweaked/enhanced) and can be used to:\r\n* transpile ES2015 to ES5 w/ sourcemaps\r\n* transpile TypeScript to ES5 w/ sourcemaps\r\n* transpile SASS to CSS w/ sourcemaps\r\n* check JS/TS code style & code quality (requires JSCS/JSHint/TSHint config files to be present)\r\n* serve the app with support for multi-device sync (using BrowserSync) and watch tasks that constantly do all the above without stopping when an error occurs (continuous flow for the developer with useful feedback)\r\n* generate production bundles for CSS/JS/HTML/images\r\n* serve the production build (without watch)\r\n\r\nModernWebDevBuild has minimal requirements regarding the project structure and the presence of some files, but I think this is positive as it provides a good starting point for larger projects. \r\n\r\nThere are some major features still missing such as testing integration, configurability & extensibility, but I think that it is already useful as is.\r\n\r\nModernWebDevGenerator is a Yeoman generator that integrates the use of ModernWebDevBuild (which is just one npm dep) and generates a working project starting point. It integrates some code organization/design guidelines for structuring the application components, pages, etc in a logical manner while considering componentization as first-class concept by regrouping all pieces of a given component together (e.g., component class, component styles, component tests, ...). Given that the build is flexible enough, it doesn't prevent users from reorganizing as they wish.\r\n\r\nBoth projects are pretty opinionated thus I suppose that there are choices in there that you wouldn't impose on your users (e.g., Gulp, SystemJS, JSPM, SASS, ...), but maybe the feature set and/or necessary extensibility could be integrated within Angular CLI and/or Angular Toolkit?\r\n\r\nI think that:\r\n* having a recommended project structure & organization guidelines is beneficial at many levels\r\n* having live reloading with multi-device synchronization support is great\r\n* having continuous transpilation, code compilation/quality/style feedback (without breaking) is awesome for developer productivity\r\n* having a \"standard\" way of building projects (from dev to prod) is tremendously useful for larger projects and integration with CI & CD solutions\r\n* having an extension system to let the community cater for its own needs is a must (e.g., CSS copy by default and a SASS plugin for those who want that)\r\n\r\nMost importantly, I think that having a Google-backed basis for all this, with enough anchor points for extensions would be awesome for larger projects requiring more than Plunker :)\r\n\r\nBy having this one central piece in the Angular \"build puzzle\", it might be easier to make related projects evolve in the good direction; for example for now TypeScript can look up modules in node_modules but is totally incapable of doing the same with jspm_packages, although that could be really nice."},"comment":{"url":"https://api.github.com/repos/angular/angular-cli/issues/comments/167421762","html_url":"https://github.com/angular/angular-cli/issues/49#issuecomment-167421762","issue_url":"https://api.github.com/repos/angular/angular-cli/issues/49","id":167421762,"user":{"login":"Swiip","id":475895,"avatar_url":"https://avatars.githubusercontent.com/u/475895?v=3","gravatar_id":"","url":"https://api.github.com/users/Swiip","html_url":"https://github.com/Swiip","followers_url":"https://api.github.com/users/Swiip/followers","following_url":"https://api.github.com/users/Swiip/following{/other_user}","gists_url":"https://api.github.com/users/Swiip/gists{/gist_id}","starred_url":"https://api.github.com/users/Swiip/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/Swiip/subscriptions","organizations_url":"https://api.github.com/users/Swiip/orgs","repos_url":"https://api.github.com/users/Swiip/repos","events_url":"https://api.github.com/users/Swiip/events{/privacy}","received_events_url":"https://api.github.com/users/Swiip/received_events","type":"User","site_admin":false},"created_at":"2015-12-27T16:04:29Z","updated_at":"2015-12-27T16:04:29Z","body":"Yeoman community is definitely already working on generators for Angular 2. @zckrs and I already have a walking skeletton of an Angular 2 generator working both with Webpack of SystemJS / JSPM: [generator-fountain-angular2](https://github.com/FountainJS/generator-fountain-angular2). It still miss the switch between Babel or TypeScript but it’s on what I’m working right now.\r\n\r\nI think Yeoman is the best platform to address seed projects and component generation, it’s designed for that and offers lots of built in tools to do it efficiently like [inquirer](https://github.com/SBoudrias/Inquirer.js/) or [mem-fs-editor](https://github.com/SBoudrias/mem-fs-editor).\r\n\r\nYeoman is perfectly capable to handle a coherent ecosystem of generators. I think we prove it through the very high number of options in [generator-gulp-angular](https://github.com/Swiip/generator-gulp-angular). But there is more, there is dedicated features for that in Yeoman like generator inheritance and [composition](http://yeoman.io/authoring/composability.html). In fact [FoutainJS](https://github.com/FountainJS/generator-fountain-webapp) is exactly based on this concept and is already capable to compose 12 generators to generate very differents apps. ([README](https://github.com/FountainJS/generator-fountain-webapp), [DESIGN](https://github.com/FountainJS/generator-fountain-webapp/blob/master/DESIGN.md))\r\n\r\nFinally, I must admit I’m not a fan of the **\"framwork-cli\"** approach. It implies too much that you have to use the framework tools to use the framework and doesn't promote community. The best way to start an Angular 1 project as always been to use Yeoman and that’s great. The Yeoman community created a lots of great project (like mine I hope but also :) [angular-fullstack](https://github.com/angular-fullstack/generator-angular-fullstack) and [jhipster](http://jhipster.github.io/).\r\n"}}