Webpack gemeldet Größe ist riesig im Vergleich zu aktuellen Ausgabe

Question

Ich erhalte, dass Webpack gemeldet Größe sehr groß ist im Vergleich zu aktuellen Ausgabe

[BABEL] Note: The code generator has deoptimised the styling of "node_modules/html-webpack-plugin/node_modules/lodash/lodash.js" as it exceeds the max of "100KB". 
[BABEL] Note: The code generator has deoptimised the styling of "node_modules/moment/moment.js" as it exceeds the max of "100KB". 
Hash: 115ba034c25a5de14baa 
Version: webpack 1.13.1 
Time: 35574ms 
     Asset  Size Chunks    Chunk Names 
    dist.js  563 kB  0 [emitted] main 
dist.js.map  855 kB  0 [emitted] main 
index.html 180 bytes   [emitted] 
    [0] multi main 28 bytes {0} [built] 
    + 130 hidden modules 
Child html-webpack-plugin for "index.html": 
     + 4 hidden modules 

der Ausgang um 20kb ist, im Alter dauert es auch, um 10s

CONFIG:

/* globals __dirname, process */ 
var path = require('path'); 
var webpack = require('webpack'); 
var HtmlWebpackPlugin = require('html-webpack-plugin'); 

var node_env = process.env.NODE_ENV || 'development'; 
console.log(node_env) 

var config = { 
    context: __dirname + '/client', 
    entry: { 
    main: [ 
     "./app.js" 
    ] 
    }, 
    output: { 
    path: __dirname + "./public", 
    filename: "dist.js" 
    }, 
    devtool: "source-map", 
    module: { 
    loaders: [ 
     { 
     test: /\.js?$/, 
     loader: 'babel-loader', 
     include: [ 
      path.resolve(__dirname, 'client'), 
     ], 
     exclude: /node_modules/ 

     }, 
     { 
     test: /\.less$/, 
     loader: "style!css!less" 
     }, 
     { 
     test: /\.css/, 
     loader: "style!css" 
     } 
    ] 
    }, 
    resolve: { 
    // you can now require('file') instead of require('file.js') 
    extensions: ['', '.js', '.json'] 
    }, 
    plugins: [ 
    new HtmlWebpackPlugin({ 
     title: 'Webpack demo', 
     hash: true, 
     filename: 'index.html', 
     template: __dirname + '/client/index.html', 
    }) 
    ] 
} 

if (node_env === 'production') { 
    config.plugins.push(new webpack.optimize.UglifyJsPlugin({ 
    compress: { 
     warnings: false 
    } 
    })); 
} 

module.exports = config 

Answer 1

ich nehme die Frage nach diesen Zeilen ist:

[BABEL] Note: The code generator has deoptimised the styling of "node_modules/html-webpack-plugin/node_modules/lodash/lodash.js" as it exceeds the max of "100KB". 
[BABEL] Note: The code generator has deoptimised the styling of "node_modules/moment/moment.js" as it exceeds the max of "100KB". 

Diese Nachricht ist von babel-loader, die Quellen mit gigantischen Größen (über 100kb) trifft. Normalerweise und in genau diesem Fall bedeutet das, dass Sie (oder einige Ihrer Abhängigkeiten) bereits gebündelte Bibliotheken (lodash und moment) benötigen, die keine Verarbeitung durch Babel erfordern.

Die Lösung ausgeschlossen node_modules/ von babel-loader Konfiguration wäre (dies Ihre webpack.config.js-module.loaders Abschnitt hinzufügen):

{ 
    test: /\.js$/, 
    loader: 'babel-loader', 
    exclude: /node_modules/ 
} 

Dies funktioniert wie die gemeinsame Erwartung Paket auf npm bereits kompilierte zu veröffentlichen ist sie ES5 so müssen normalerweise nicht durch Babel verarbeitet werden.

Answer 2

hatte ich das gleiche Problem in meinem Projekt:

Vermögenswerte/profile-view/dist/bundle.js "type = "text/babel">

aber nach dem {type Entfernen =" text/babel "} Attribut aus dem Code, verschwand die Fehlermeldung