|
1 |
| -# vue-starter |
| 1 | +# vue-webpack-boilerplate |
2 | 2 |
|
3 |
| -> A Vue.js starter kit that lets you focus on more programming and less configruation. |
| 3 | +> A full-featured Webpack setup with hot-reload, lint-on-save, unit testing & css extraction. |
4 | 4 |
|
5 |
| -## Build Setup |
| 5 | +> This template is Vue 2.0 compatible. For Vue 1.x use this command: `vue init webpack#1.0 my-project` |
6 | 6 |
|
7 |
| -``` bash |
8 |
| -# install dependencies |
9 |
| -npm install |
| 7 | +## Documentation |
| 8 | + |
| 9 | +- [For this template](http://vuejs-templates.github.io/webpack): common questions specific to this template are answered and each part is described in greater detail |
| 10 | +- [For Vue 2.0](http://vuejs.org/guide/): general information about how to work with Vue, not specific to this template |
10 | 11 |
|
11 |
| -# serve with hot reload at localhost:8080 |
12 |
| -npm run dev |
| 12 | +## Usage |
13 | 13 |
|
14 |
| -# build for production with minification |
15 |
| -npm run build |
| 14 | +This is a project template for [vue-cli](https://github.com/vuejs/vue-cli). **It is recommended to use npm 3+ for a more efficient dependency tree.** |
| 15 | + |
| 16 | +``` bash |
| 17 | +$ npm install -g vue-cli |
| 18 | +$ vue init webpack my-project |
| 19 | +$ cd my-project |
| 20 | +$ npm install |
| 21 | +$ npm run dev |
16 | 22 | ```
|
17 | 23 |
|
18 |
| -For detailed explanation on how things work, consult the [docs for vue-loader](http://vuejs.github.io/vue-loader). |
19 |
| -======= |
| 24 | +If port 8080 is already in use on your machine you must change the port number in `/config/index.js`. Otherwise `npm run dev` will fail. |
| 25 | + |
| 26 | +## What's Included |
| 27 | + |
| 28 | +- `npm run dev`: first-in-class development experience. |
| 29 | + - Webpack + `vue-loader` for single file Vue components. |
| 30 | + - State preserving hot-reload |
| 31 | + - State preserving compilation error overlay |
| 32 | + - Lint-on-save with ESLint |
| 33 | + - Source maps |
| 34 | + |
| 35 | +- `npm run build`: Production ready build. |
| 36 | + - JavaScript minified with [UglifyJS](https://github.com/mishoo/UglifyJS2). |
| 37 | + - HTML minified with [html-minifier](https://github.com/kangax/html-minifier). |
| 38 | + - CSS across all components extracted into a single file and minified with [cssnano](https://github.com/ben-eb/cssnano). |
| 39 | + - All static assets compiled with version hashes for efficient long-term caching, and a production `index.html` is auto-generated with proper URLs to these generated assets. |
| 40 | + - Use `npm run build --report`to build with bundle size analytics. |
| 41 | + |
| 42 | +- `npm run unit`: Unit tests run in PhantomJS with [Karma](http://karma-runner.github.io/0.13/index.html) + [Mocha](http://mochajs.org/) + [karma-webpack](https://github.com/webpack/karma-webpack). |
| 43 | + - Supports ES2015+ in test files. |
| 44 | + - Supports all webpack loaders. |
| 45 | + - Easy mock injection. |
| 46 | + |
| 47 | +- `npm run e2e`: End-to-end tests with [Nightwatch](http://nightwatchjs.org/). |
| 48 | + - Run tests in multiple browsers in parallel. |
| 49 | + - Works with one command out of the box: |
| 50 | + - Selenium and chromedriver dependencies automatically handled. |
| 51 | + - Automatically spawns the Selenium server. |
| 52 | + |
| 53 | +### Fork It And Make Your Own |
| 54 | + |
| 55 | +You can fork this repo to create your own boilerplate, and use it with `vue-cli`: |
| 56 | + |
| 57 | +``` bash |
| 58 | +vue init username/repo my-project |
| 59 | +``` |
0 commit comments