On va utiliser un projet déjà existant de boilerplate que j'ai très légèrement modifier pour se rapprocher plus d'une architecture angular habituelle. Comme ça on peut direct entrer dans le vif du sujet. Quelques ressources supplémentaires :
- [Le projet initial] : (https://github.com/Foxandxss/angular-webpack-workflow my_app)
- [plus de lecture sur angular et webpack] : (http://angular-tips.com/blog/2015/06/using-angular-1-dot-x-with-es6-and-webpack/)
- [Différence entre service et factory] : (https://toddmotto.com/factory-versus-service)
Readme du projet :
A complete, yet simple, starter for Angular using Webpack.
This workflow serves as a starting point for building Angular 1.x applications using Webpack 2.x. Should be noted that apart from the pre-installed angular package, this workflow is pretty much generic.
- Heavily commented webpack configuration with reasonable defaults.
- ES6, and ES7 support with babel.
- Source maps included in all builds.
- Development server with live reload.
- Production builds with cache busting.
- Testing environment using karma to run tests and jasmine as the framework.
- Code coverage when tests are run.
- No gulp and no grunt, just npm scripts.
Warning: Make sure you're using the latest version of Node.js and NPM
Clone/Download the repo then edit
app.js
inside/src/app/app.js
# clone our repo
$ git clone https://github.com/preboot/angularjs-webpack.git my-app
# change directory to your app
$ cd my-app
# install the dependencies with npm
$ npm install
# start the server
$ npm start
go to http://localhost:8080 in your browser.
What you need to run this app:
node
andnpm
(Use NVM)- Ensure you're running Node (
v4.1.x
+) and NPM (2.14.x
+)
fork
this repoclone
your forknpm install
to install all dependencies
After you have installed all dependencies you can now run the app with:
npm start
It will start a local server using webpack-dev-server
which will watch, build (in-memory), and reload for you. The port will be displayed to you as http://localhost:8080
.
- single run:
npm run build
- build files and watch:
npm start
- single run:
npm test
- live mode (TDD style):
npm run test-watch