webpack

Webpack

This is a simple example of using webpack with riot. It uses webpack loader riotjs-loader.

Run locally

Download or clone this repo.

Install packages.

$ npm install

And then run the server using webpack-dev-server or any possible way you know

$ ./dev
# or $ ./node_modules/.bin/webpack-dev-server --progress --colors -d --port 3000

• Open http://localhost:3000/
• Open http://localhost:3000/webpack-dev-server/ for dev server with hot reloading.

ES6 using Babel

You can add ES6 support as shown in riotjs-loader's example. All you have to do is edit webpack.config.js and change webpack's modules to

module: {
  loaders: [
    preLoaders: [
      { test: /\.tag$/, exclude: /node_modules/, loader: 'riotjs-loader', query: { type: 'none' } }
    ],
    loaders: [
      { test: /\.js$|\.tag$/, exclude: /node_modules/, loader: 'babel-loader', query: { presets: ['es2015'] } }
    ]
  ]
}

As explained in riot-examples/es6, you will lose riot's shorthand syntax. So this:

getMessage() { ... }

becomes (using ES6):

this.getMessage = () => { ... }