Hello Webpack 2, goodbye babel-loader
Now that Webpack 2 can handle native ES2015 modules, it no longer makes sense to transpile code in a loader

The traditional way to load ES2015 modules into a webpack app is using babel-loader. With the release of webpack 2, this is no longer necessary. Webpack now supports native JavaScript modules as well as Common JS, so code doesn’t need to be transformed before it’s passed to webpack.

Doing so means babel is run once for every input file, including anything imported from node_modules. And as loaders switch over to returning ES2015 modules, we’d need to start running babel-loader on every single file type, not just JavaScript.

Instead it’s preferable to pass webpack ES2015 code (which enables the new tree shaking feature) and then transform the entire bundle into ES5 in one operation. That’s the purpose of babel-webpack-plugin.

It works in almost exactly the same way as UglifyJsPlugin. Just add to the plugins list (before UglifyJs if you’re using it) and the code will be transformed from ES2015 to ES5 all in one go.


   npm install babel-webpack-plugin


Add BabelPlugin to the list of plugins:

var BabelPlugin = require("babel-webpack-plugin");

/* ... */

plugins: [
	new BabelPlugin({
		test: /\.js$/,
		presets: ['es2015'],
		sourceMaps: false,
		compact: false

/* ... */


The options above are the default. For all available options, see babel documentation here:babel-docs.

Leave a Comment Comments on nourish.je are made via pull request. Replying takes you to GitHub where you can add your comment directly to the source code; send a pull request to get it added to the live site.
Formatting help
// All comments are contained inside the responses tag
{% responses %}
    // Each comment has its own response tag
    {% response author="Steve" email="steve@nourish.je" date="2016-11-22 19:35:28" %}
        This is the comment text
    {% endresponse %}
    // You can nest responses tags to create threaded comments
    {% response  author="John" email="john@example.com" date="2016-11-22 19:36:48" %}
        I'm a top level comment
        {% responses %}
            {% response author="Dave" email="dave@example.com" date="2016-11-22 19:37:38" %}
                I'm a nested comment
            {% endresponse %}
            // You can use Markdown inside comments
            {% response author="Chris" email="chris@example.com" date="2016-11-22 19:38:05" %}
                **So am I!**
            {% endresponse %}
        {% endresponses %}
    {% endresponse %}
{% endresponses %}


← My new comment system: edit the page source and send a pull request