A
A
Andrey2016-10-27 16:51:34
webpack
Andrey, 2016-10-27 16:51:34

How to make minified build with webpack and es2015?

There are actually two questions:
1. Why if you write like this:

module: {
        loaders: [{
            test: /\.js$/,
            exclude: /node_modules/,
            loader: 'babel',
            query: {
                presets: ['es2015']
            }
        }]
    }

then an error occurs:
"Module build failed: Error: Couldn't find preset "es2015" relative to directory ...."
And if you do this:
loaders: [{
            test: /\.js$/,
            loader: 'babel-loader'
        }]

plus add a .babelrc file in which to specify:
{
  "presets": ["es2015"]
}

Does everything work?
2. I use Babel-loader:
module: {
        loaders: [{
            test: /\.js$/,
            loader: 'babel-loader'
        }]
    }

If after that you use the minification module:
if(NODE_ENV === 'prod') {
    module.exports.plugins.push(new webpack.optimize.UglifyJsPlugin({
        compress: {
            warnings: false,
            drop_console: true
        }
    }))
}

Then an error appears:
"SyntaxError: Unexpected token: name (Name)..."
Where the legs grow is understandable, in the file pointed to by the error Import is used:
"import Name from '../../../../Name .js';"
Minification of ES6 constructs is too tough for Webpack.
Here is a "great" recommendation to use with ES5 Webpack.
It turns out that first, with some Gulp with Babel, compile ES6 to ES5, and then heroically compile it with Webpack? I do not think that such an approach would ensure the admiration of the community. for sure there is an opportunity to get by with one Webpack.
UPD
The problems turned out to be interrelated.
Webpack does not convert ES6 to ES5. If you specify loader: 'babel?presets[]=es2015', then an error appears:
Module build failed: Error: Could n't find preset "es2015" relative to directory

Answer the question

In order to leave comments, you need to log in

1 answer(s)
A
Andrey, 2016-10-27
@f-end

Found the reason.
Webpack looks for the node_modules folder in the parent directories of the files being processed.
If they do not find them, then Babel does not work out and - as a result - the minifier chokes on the untransformed code

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question