2017-01-19 52 views
0

我想知道如何指示我的webpack配置爲開發和生產模式運行不同的源地圖。根據開發/生產模式切換webpack源地圖

因爲這是我只是評論一個我不想要的,這顯然很不方便,我希望這個決定是動態的,取決於我正在運行的npm腳本 - 生產服務器,還是webpack dev服務器。

我已經有一個變量對應於開發模式(const debug),但我不確定如何在我的配置中使用它來確定不同的源地圖。

這裏是我當前的配置...

Webpack.config.js

const debug = process.env.NODE_ENV !== "production"; 

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

module.exports = { 
    // devtool: 'eval-source-map', 
    devtool: 'source-map', 
    entry: path.join(__dirname, 'public', 'app-client.js'), 
    devServer: { 
     inline: true, 
     port: 3333, 
     contentBase: "public/static/", 
     historyApiFallback: { 
     index: '/index-static.html' 
     } 
    }, 
    output: { 
     path: path.join(__dirname, 'public', 'static', 'js'), 
     publicPath: "/js/", 
     filename: 'bundle.js' 
    }, 
    module: { 
     loaders: [ 
      { 
       test: path.join(__dirname, 'public'), 
       loader: ['babel-loader'], 
       query: { 
        presets: debug ? ['react', 'es2015', 'react-hmre', 'stage-2'] : ['react', 'es2015', 'stage-2'] 
       } 
      }, 
      { 
       test: /\.(jpe?g|png|gif|svg)$/i, 
       loaders: [ 
        'file?hash=sha512&digest=hex&name=[hash].[ext]', 
        'image-webpack?bypassOnDebug&optimizationLevel=7&interlaced=false' 
       ] 
      } 
      ] 
    }, 
    plugins: debug ? [] : [ 
     new webpack.DefinePlugin({ 
     'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV) 
     }), 
     new webpack.optimize.DedupePlugin(), 
     new webpack.optimize.OccurenceOrderPlugin(), 
     new webpack.optimize.UglifyJsPlugin({ 
     compress: { warnings: false }, 
     mangle: true, 
     sourcemap: false, 
     beautify: false, 
     dead_code: true 
     }), 
    ] 
} 
webpack.config.js

回答

0

process.env.NODE_ENV,如果你調用的WebPack時,如所提供的環境變量NODE_ENV只設置在您的package.json中使用NODE_ENV webpack。如果您還需要支持Windows,請使用env-variable軟件包。

有關詳細信息和其他方法,另請參閱關於building for production的指南。

相關問題