Verkleinerungs nur JS-Dateien in webpack bauen

Question

ich webpack für meine Produktion zu bauen bin mit, wie folgt:

module.exports = { 
 
    devtool: 'source-map', 
 
    entry: [ 
 
     'babel-polyfill', 
 
     './src/index' 
 
    ], 
 
    output: { 
 
     filename: 'bundle.js', 
 
     path: path.join(__dirname, 'dist') 
 
    }, 
 
    plugins: [ 
 
     new webpack.optimize.OccurenceOrderPlugin(), 
 
     new webpack.optimize.DedupePlugin(), 
 
     new webpack.ContextReplacementPlugin(/moment[\/\\]locale$/, /en|he/), 
 
     new webpack.DefinePlugin({ 
 
      'process.env.NODE_ENV': JSON.stringify('production') 
 
     }), 
 
     new ExtractTextPlugin('style.css'), 
 
     new webpack.optimize.UglifyJsPlugin({ 
 
      compressor: { 
 
       warnings: false 
 
      } 
 
     }) 
 
    ], 
 
    module: { 
 
     loaders: [ 
 
      { 
 
       test: /\.js$/, 
 
       loaders: ['babel'], 
 
       include: path.join(__dirname, 'src'), 
 
       exclude: path.join(__dirname, 'src', 'test') 
 
      }, 
 
      { 
 
       test: /\.scss$/, 
 
       loader: ExtractTextPlugin.extract('css?-minimize!sass!postcss-loader'), 
 
       include: path.join(__dirname, 'src', 'styles') 
 
      }, 
 
      { 
 
       test: /\.(jpe?g|png|gif)$/i, 
 
       loader: 'url?limit=8192', 
 
       include: path.join(__dirname, 'assets') 
 
      }, 
 
      { 
 
       test: /\.svg$/, 
 
       loader: 'babel!svg-react', 
 
       include: path.join(__dirname, 'assets') 
 
      } 
 
     ] 
 
    }, 
 
    postcss: [autoprefixer({ browsers: ['last 2 versions'] })] 
 
};

Wie Sie sehen können, wird der Code minimierte von UglifyJsPlugin. Das Problem ist, dass es auch die CSS-Dateien minimiert (die von ExtractTextPlugin extrahiert werden). Ich möchte die CSS-Minification vermeiden, um sie nach dem Build zu verarbeiten.

Wie kann ich dem Plugin mitteilen, nur meine JS-Datei zu minimieren?

Danke,
Tomer

Answer 1

See: Webpack Uglify errors in CSS Sie ein test durch einen regulären Ausdruck verunstalten und Filtern von Dateien hinzufügen ...

new webpack.optimize.UglifyJsPlugin({ 
    test: /\.(js|jsx)$/ 
}) 

Oder ...

Sie müssen nicht alles in einem tun webpack.config.js.

Da Sie die CSS in eine separate Datei erstellen, haben Sie zwei webpack.configs, eine für die js und eine weitere für die css. Vergiss nicht, beides zu bauen.