simple-vue-app

A CLI command to build a simple Vue.js SPA with almost no configuration.

Downloads in past

Stats

StarsIssuesVersionUpdatedCreatedSize
simple-vue-app
102.1.06 years ago7 years agoMinified + gzip package size for simple-vue-app in KB

Readme

simple-vue-app
npm version Downloads/month Dependency Status
This provides a CLI command to build a single page application (SPA) with Vue.js.
$ simple-vue-app src -o dist
This command transpiles from src/index.html and src/index.js to dist/index.html, dist/index.js and dist/index.css.
$ simple-vue-app src -o dist -w
The --watch (or -w) option observes file changes then will rebuild on every change. It's fast.

💿 Installation

Use npm.
$ npm install --save-dev simple-vue-app

📖 Usage

This is a tool to build a single page application powered by Vue.js.
This tool has some commands.

$ simple-vue-app [OPTIONS]

    The main command, this builds your cool application.

    OPTIONS:
        [SOURCE_DIR] ............... The source directory. Default is "src".
        --output, -o <OUTPUT_DIR> .. The output directory. Default is "out".
        --ie ....................... The flag to do additional processes for IE.
        --watch, -w ................ The flag to observe files and rebuild on 
                                     every file change.
        --include-compiler ......... The flag to use compilers of Vue.js.

    Prepare the following files:

    - '[SOURCE_DIR]/index.js'

    Then this will create the following files into <OUTPUT_DIR>:

    - 'index.html' is the main page.
    - 'index.css' is the main stylesheet.
    - 'index.js' is the main script.
    - 'index.js.map' is the source map of the main script.
    - And detected assets.

    That's almost all, enjoy for development!

$ simple-vue-app --test [OPTIONS]

    This runs the tests of your cool application with Karma + Mocha.

    OPTIONS:
        [SOURCE_DIR] ............... The source directory. Default is "test".
        --output, -o <OUTPUT_DIR> .. The output directory. Default is 
                                     ".test_workspace".
        --ie ....................... The flag to do additional processes for IE.
        --watch, -w ................ The flag to observe files and rebuild on 
                                     every file change.
        --include-compiler ......... The flag to use compilers of Vue.js.

    This builds '[SOURCE_DIR]/*.js' files then runs them by Karma + Mocha.

$ simple-vue-app --help

    Print this help text.

$ simple-vue-app --version

    Print this version number.

Details

This command uses rollup.js with:
- [babel-preset-env]
    - last 2 Chrome versions
    - last 2 Firefox versions
    - last 1 Edge versions
    - last 1 Safari versions
    - last 1 IE versions (only when you gave `--ie` option)
- [babel-plugin-transform-vue-jsx]
- [babel-plugin-transform-inline-environment-variables]
- [babel-plugin-minify-constant-folding]
- [babel-plugin-minify-dead-code-elimination]
- [babel-polyfill]

And use PostCSS for CSS of .vue files:

If --watch option is given, NODE_ENV environment variable becomes development. Otherwise it becomes production.
If --watch option is given, the generated files have source maps.

📰 Change log

See GitHub Releases

💎 Contributing

Welcome ❤
Please use GitHub's Issues/PRs.