tlvuestarter

This is a fork of webpack-simple template, with a few additions of my own.

In particular, there are two things here that you might want to check out, I think those are pretty cool and really improve the development process for web applications:

• The use of mock-apis
• The Component Catalog (See a live demo)

Contrary of what webpack-simple says, I do encourage you to use this template for production projects.

Usage

This is a project template for vue-cli.

$ npm install -g vue-cli
$ vue init tonylampada/tlvuestarter my-project
$ cd my-project
$ npm install
$ npm run dev

What's Included

• Styling with Bulma CSS framework
• Font Awesome icons
• Simple AJAX with axios
• npm run dev: Webpack + vue-loader with proper config for source maps & hot-reload (See a live demo).
• npm run build: build with HTML/CSS/JS minification.
• Backendless environment with Mock APIs
• Basic mocked authentication that is easy to plug in your backend
• npm run unit: Run unit tests, with coverage reports inside /coverage.
• A Component Catalog

Mock APIs

• api.js - your real backend calls go here (in this case we are actually consuming endpoints from Github's api, so... replace with what makes sense for your backend).
• apimock.js - fake api. Have all the same methods on api.js but returns hardcoded-ish data build with plain javascript.

When you fire the development environment with npm run dev, the fake api from apimock.js will be used, but when you build the production version with npm run build, the real api from api.js will be used instead (this is implemented using environment variables in webpack-config.js)

Why would I want to have that?

Component Catalog

There are two SPAs here: index.html which is supposed to be your main front-end application, and docs.html which is the Component Catalog.

Any vue component that you create like src/**/docs/*Docs.vue will be automatically discovered and added to the docs app.