JavaScript Vue HTML Other
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.


Single Page Application Boilerplate

A full-featured Webpack setup with vue-router, vuex, material-design-lite, auth0, vue-resource, hot-reload, lint-on-save & css extraction.

I have extended the official webpack boilerplate with often used plugins and functionalities. I have made this because the official vuejs-templates maintainers wanted to keep the webpack template simple.

The extra functionalities added are:

Every functionality mentioned above is optional which means, you can switch them off easily during the initial stage without any issue with the other functionalities.

All the functionalities have been made as independent of each other as possible.


With vue-cli globally installed, just run the following command:

$ npm i -g vue-cli
$ vue init pksunkara/spoiler appname

Your singe page application is now ready to be developed.

$ npm install
$ npm run dev

It is recommended to use npm 3+ for a more efficient dependency tree.

What's Included

  • npm run dev: first-in-class development experience.

    • Webpack + vue-loader for single file Vue components.
    • State preserving hot-reload
    • State preserving compilation error overlay
    • Lint-on-save with ESLint
    • Source maps
  • npm run build: Production ready build.

    • JavaScript minified with UglifyJS v3.
    • HTML minified with html-minifier.
    • CSS across all components extracted into a single file and minified with cssnano.
    • 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.
    • Use npm run build --reportto build with bundle size analytics.
  • npm run unit: Unit tests run in JSDOM with Jest, or in PhantomJS with Karma + Mocha + karma-webpack.

    • Supports ES2015+ in test files.
    • Easy mocking.
  • npm run e2e: End-to-end tests with Nightwatch.

    • Run tests in multiple browsers in parallel.
    • Works with one command out of the box:
      • Selenium and chromedriver dependencies automatically handled.
      • Automatically spawns the Selenium server.