Yeoman 'fountain' generator to start a webapp with Vue http://fountainjs.io
JavaScript Vue CSS HTML
Latest commit aa1f4d3 Dec 19, 2016 @zckrs zckrs committed on GitHub Merge pull request #11 from FountainJS/bump-yeoman-generator
Use Yeoman v1.0.0
Permalink
Failed to load latest commit information.
generators Use Yeoman to v1.0.0-rc1 Dec 15, 2016
test Fix tests Dec 16, 2016
.editorconfig first commit Aug 10, 2016
.gitattributes first commit Aug 10, 2016
.gitignore first commit Aug 10, 2016
.travis.yml first commit Aug 10, 2016
LICENSE first commit Aug 10, 2016
README.md Update Readme for Node requirement Dec 13, 2016
gulpfile.js first commit Aug 10, 2016
index.js first commit Aug 10, 2016
package.json bump to version 1.0.0-rc2 Dec 9, 2016

README.md

FountainJS

Build Status codecov

Fountain Vue.js 2 Generator

Vue 2

This Yeoman generator allows you to start an Vue.js web app with the best Developer Experience out of the box!

No matter what framework or module management you want to use, we got you covered with a cutting edge working configuration.

We use Gulp 4 as a task manager but we'll ask you questions about:

  • Modules management: Webpack
  • JS preprocessor: Babel
  • CSS preprocessor: Sass, Stylus, Less, none

This generator is a sub-generator of the the Yeoman Fountain generator for webapps generator-fountain-webapp.

Generator Fountain Vue 2 structure

To take profit of the best of the Yeoman infrastructure, we heavily relies on the composability natures of the generators.

Thereby, each needs of your future application will be addressed by a dedicated Yeoman generator (each will be used depending of the options you selected or not).

More informations in DESIGN.md.

Web tooling layer

Gulp ESLint BrowserSync Karma

Module management layer

Webpack SystemJS Bower

Usage

Requirement Node 6+ && NPM 3+

This generator is targeted to be used with Node >= 6.0.0 and NPM => 3.0.0. You can check your version number with the command

node --version && npm --version

Install

Install required tools yo:
npm install -g yo
Install generator-fountain-vue:
npm install -g generator-fountain-vue

Run

Create a new directory, and go into:
mkdir my-new-project && cd my-new-project
Run yo fountain-vue, and select desired technologies:
yo fountain-vue

Use NPM scripts

  • npm run build to build an optimized version of your application in /dist
  • npm run serve to launch a browser sync server on your source files
  • npm run serve:dist to launch a server on your optimized application
  • npm run test to launch your unit tests with Karma
  • npm run test:auto to launch your unit tests with Karma in watch mode

Or Gulp tasks

If you have gulp-cli installed in global packages you can use equivalent:

  • gulp or gulp build
  • gulp serve
  • gulp serve:dist
  • gulp test
  • gulp test:auto

If you don't have gulp-cli installed in global, you should have this error:

/usr/local/lib/node_modules/gulp/bin/gulp.js:121 gulpInst.start.apply(gulpInst, toRun); TypeError: Cannot read property 'apply' of undefined

Sub-generators

Few sub-generators are available. You can see the full list by running yo --generators.
Each generator has 2 options:

  • You can set the name of the generated item with --name
  • You can set the path of the generated item with --dir

Example:

yo fountain-vue:component --name myComponent --dir components/game

Start development

Changelog

Contributing