2016-01-10 4 views
2

Я использую webpack для создания своего пакета и поставщиков.Webpack slow on vendors compilation

Моя проблема заключается в том, что, поскольку я добавил поставщиков к моей компиляции, мое время компиляции прошло от от 2s до 20s (на медленной машине вы можете подождать как 40 секунд).

Я заметил, что sourceMap генерируется все время, но когда я компиляции для производства, он не оптимизирован для создания sourceMap затем удалить их с уродовать плагин. Наверное, я пропустил точку!

Я пробовал #eval, но вес как раз в 4 раза больше, а также не компилируется быстрее (даже медленнее).

Так я ищу Святой Грааль: * способ отключить sourceMap для всех компиляции * способ отключить sourceMap только для поставщика (для развития) * система кэширования перекомпилировать только измененный файл (как при использовании --watch)

мой рабочий процесс заключается в использовании Dev окр (поэтому я использую --watch) на моей локальной машине, а затем толкая его на мой Dev сервер с Дженкинс что компилировать все. Используя часы на сервере не вариант (я держу WebPack до настоящего времени, и если изменить список поставщиков, я должен перезапустить --watch))

Опцион может быть, чтобы удалить производитель из моей WebPack конфигурации , но это была бы моя последняя попытка.

мой webpack.config.js:

var path = require('path'); 
var webpack = require('webpack'); 

var jsPath = path.join(__dirname, './src/js/src/'); 
var vendorPath = path.join(__dirname, './src/js/src/vendors/'); 

// Detect environnement from package.json or command line 
var prod = process.argv.indexOf("--prod") > -1; 
var dev = process.argv.indexOf("--dev") > -1; 

module.exports = { 
    entry: { 
     app: jsPath + 'init.js', 
     vendor: [ 
      vendorPath + 'jquery.js', 
      vendorPath + 'bootstrap.js', 
      vendorPath + 'nunjucks.js', 
      vendorPath + 'jquery.pickmeup.js', 
      vendorPath + 'select2.js', 
      vendorPath + 'select2_ext.js' 
     ] 
    }, 
    // Key for ProvidePlugin 
    resolve: { 
     alias: { 
      jquery: vendorPath + 'jquery.js' 
     } 
    }, 
    output: { 
     path: path.join(__dirname, './src/js/build/'), 
     filename: 'bundle.js', 
     publicPath: '' 
    }, 
    devtool: prod ? "" : "#inline-source-map", 
    module: { 
     loaders: [ 
      {test: /\.js$/, exclude: /node_modules/, loader: "babel-loader", query: {compact: false}} 
     ] 
    }, 
    plugins: [ 
     // Expose $ as global variable 
     new webpack.ProvidePlugin({ 
      $: "jquery", 
      jQuery: "jquery" 
     }), 
     // Concat vendors files 
     new webpack.optimize.CommonsChunkPlugin({ 
      name: "vendor", 
      filename: "vendor.js", 
      minChunks: Infinity 
     }), 
     // Set __DEBUG__ global variable 
     new webpack.DefinePlugin({ 
      __DEBUG__: dev 
     }) 
    ] 
    // In 'production', Uglify all JS chunked files 
     .concat(prod ? 
      [ 
       new webpack.optimize.UglifyJsPlugin({ 
        compress: { 
         warnings: false 
        }, 
        sourceMap: false, 
        mangle: { 
         except: ['$', 'exports', 'require'] 
        } 
       }) 
      ] 
      : [] 
     ) 
}; 

ответ

1

Вы можете использовать SourceMapDevToolPlugin непосредственно вместо devtool, чтобы исключить определенные куски от наличия карты источника сгенерированной. Например, если вы хотите исключить ваши vendor и polyfills связки:

config.plugins.push(new webpack.SourceMapDevToolPlugin({ 
    filename: '[name].js.map', 
    exclude: ['vendor.js', 'polyfills.js'] 
})); 
+0

Очень умный, я, наконец, изменить большую polyfill к по требованию polyfill, мне просто нужно Object.assign → '«Плагины»: [» преобразование-объект-Assign "]' – romuleald