Examples of VueJS usage
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
js
public
test
.babelrc
.gitignore
LICENSE
README.md
gulpfile.babel.js
htmltemplate.js
package.json
webpack.config.babel.js

README.md

Examples of VueJS usage

This repository contains VueJS examples (for demonstration purposes during a presentation). There is a Webpack sample configuration included as a base for building ES6 with the samples.

How do I use this?

  1. Clone the repository.
  2. Change to the ./vuejs-examples directory.
  3. Run npm install.
  4. Run gulp server.
  5. Open http://localhost:8080/public/ in a web browser.

Docs from: gulp-es6-webpack-example

Sample setup with Gulp, Babel, Mocha and Webpack over ES6, transpiled to ES5 (source maps included).

All the code, Mocha tests and config files from Gulp and Webpack are ES6.

The is a preload bundle (to be loaded during page load time) and also a separate bundle (to be lazy loaded after the user presses a button).

The lazy-loadable bundles are automatically generated by webpack and the code is just requiring things internally using ES6/CommonJS, making it possible to avoid AMD/RequireJS for asynchronous loading.

Running gulp will:

  1. Transpile ES6 code with Babel
  2. Run Mocha unit tests
  3. Package bundles with Webpack (dedupe + uglify)

See it live: run gulp server and open http://localhost:8080/public/. Verify you have downloaded just the preload JS bundle file. Now hit the button, it will download an additional bundle file, related with that button.