A full-featured Browserify +
vueifysetup with hot-reload, linting & unit testing.
This template is Vue 2.0 compatible. For Vue 1.x use this command:
vue init browserify#1.0 my-project
This is a project template for vue-cli.
$ npm install -g vue-cli
$ vue init browserify my-project
$ cd my-project
$ npm install
$ npm run dev-
npm run dev: Browserify +vueifywith proper config for source map & hot-reload. -
npm run build: Production build with HTML/CSS/JS minification. -
npm run lint: Lint JavaScript and*.vuefiles with ESLint. -
npm test: Unit tests in PhantomJS with Karma + karma-jasmine + karma-browserify, with support for mocking and ES2015.
For more information see the docs for vueify.
You will likely need to do some tuning to suit your own needs:
-
Install additional libraries that you need, e.g.
vue-router,vue-resource,vuex, etc... -
Use your preferred
.eslintrcconfig. Don't forget to keep the plugin field so that ESLint can lint*.vuefiles. -
Add your preferred CSS pre-processor, for example:
npm install less --save-dev
Then you can do:
<style lang="less"> /* write less! */ </style>
-
The dev build is served using http-server. You can edit the NPM dev script in
package.jsonto add a proxy option so that ajax requests are proxied to a separate backend API. -
For unit testing:
-
You can run the tests in multiple real browsers by installing more karma launchers and adjusting the
browsersfield inkarma.conf.js. -
You can also swap out Jasmine for other testing frameworks, e.g. use Mocha with karma-mocha.
-
You can fork this repo to create your own boilerplate, and use it with vue-cli:
vue init username/repo my-project