2017-12-30 63 views
2

Webpackの設定では、私のprodとdev環境を別々に設定しようとしました。私は各タスクのために異なるJSファイルを達成しようとしています。つまり、私がビルドするときに、特定の名前 "lib.js"でprod環境に移動するためのコードが必要です.DEV環境を実行すると、コンパイルされたファイルを "dist"フォルダに移動します。 これは私のwebpack.config.jsファイルです:Webpack prod vs dev

const webpack = require('webpack') 
const ExtractTextPlugin = require("extract-text-webpack-plugin") 
let path = require('path'); 
let config = { 
    entry: [ 

     './src/index.js' 
    ], 
    module: { 
     rules: [{ 
       test: /\.jsx?$/, 
       exclude: /node_modules/, 
       use: [ 
        'react-hot-loader', 
        'babel-loader' 
       ] 
      }, 
      { 
       test: /\.(css)$/, 
       use: ExtractTextPlugin.extract({ 
        fallback: 'style-loader', 
        use: 'css-loader' 

       }) 
      }, 
      { 
       test: /\.less$/, 
       use:ExtractTextPlugin.extract({ 
        use: 'less-loader' 
       }) 

      }, 
      { 
       test: /\.(eot|svg|ttf|woff|woff2)$/, 
       loader: 'file-loader', 
       }, 
      { 
       test: /\.js$/, 
       exclude: /node_modules/, 
       use: ['babel-loader', 'eslint-loader'] 
      } 
     ], 

    }, 
    resolve: { 
     extensions: ['*', '.js', '.jsx', '.css'], 
    }, 
    plugins: [ 
     new webpack.DefinePlugin({ 
      'process.env': { 
       'NODE_ENV': JSON.stringify(process.env.NODE_ENV) 
      } 
     }) 
    ], 
    devServer: { 
     contentBase: './dist', 
     historyApiFallback: true 
    }, 
    devtool : "cheap-module-source-map", 


} 
if (process.env.NODE_ENV === 'production') { 
    config.output= { 
     path: path.join(__dirname, '/build/'), 
     filename: 'lib.js', 
     library: ['MyLibrary'], 
     libraryTarget: 'umd' 
    }; 
    config.plugins.push(
     new webpack.optimize.UglifyJsPlugin({ sourceMap: true }), 
     new ExtractTextPlugin({ 
      filename: 'bundle.css', 
      disable: false, 
      allChunks: true 
     }), 
     new webpack.optimize.AggressiveMergingPlugin({ 
      minSizeReduce: 1, 
      moveToParents: true 

     }) 
    ) 

} else { 
    config.output= { 
     path: path.join(__dirname, '/dist/'), 
     filename: 'bundle.js', 
     library: ['MyLibrary'], 
     libraryTarget: 'umd', 
     publicPath: '/dist/' 

    }; 
    config.plugins.push(
     new webpack.optimize.UglifyJsPlugin({ sourceMap: true }), 
     new ExtractTextPlugin({ disable: true }) 
    ) 
} 

module.exports = config 

、これらは私のスクリプトです:

"scripts": { 
"dev": "webpack-dev-server -d --env.platform=default --progress --hot", 
"build": "set NODE_ENV=production && webpack -p --progress --hot" 
    } 

実際に何が起こることは、私が構築した場合にのみ、ファイルはdistのフォルダに行くということです、でも、私はNODE_ENVパラメータを "production"に設定しています。 助けてよろしいですか? ありがとう!

+0

@Prakashsharma removal &&は、実際にビルドからそれを停止します。 btw、私はWindowsマシンのためにSETを使用しています – Basilf

答えて

1

それはおそらくあなたのwebpack設定に一致しなくなるまでのスペースでproductionNODE_ENVを設定あなたはNODE_ENV=production後に持っている末尾のスペース、である可能性があります。このようなpackage.jsonでそれを変更しよう:これはthisに@dawにより、コメントに記載されている

"build": "set NODE_ENV=production&& webpack -p --progress --hot" 

SO答えます。

+0

それは本当でした! – Basilf

関連する問題