WEBPACK @ 2.2 WEBPACK-MERGE @ 2.4
我使用webpack-merge来智能地进行开发或生产配置。
我的启动脚本如下:
}
"scripts": {
"start": "webpack --env=production & node start.js",
"dev": "webpack-dev-server --env=dev",
},
我的webpack配置文件如下所示:
const webpack = require('webpack')
const ExtractTextPlugin = require('extract-text-webpack-plugin')
const CompressionPlugin = require('compression-webpack-plugin')
const webpackMerge = require('webpack-merge')
const baseConfig = function(env) {
return {
output: {
path: '/public/',
filename: 'index.js',
publicPath: '/public/',
},
module: {
rules: [
{
test: /\.js$/,
exclude: /node_modules/,
use: ['babel-loader'],
},
{
test: /\.css$/,
loader: ExtractTextPlugin.extract({
fallbackLoader: "style-loader",
loader: "css-loader",
publicPath: "/public/",
}),
},
],
},
resolve: {
extensions: ['.js', '.css'],
},
plugins: [
new webpack.DefinePlugin({
'process.env': { NODE_ENV: JSON.stringify(env) },
}),
new ExtractTextPlugin({
filename: "bundle.css",
disable: false,
allChunks: true,
}),
],
}
}
module.exports = function(env) {
return webpackMerge(baseConfig(env), env === 'dev' ? {
devtool: 'cheap-module-source-map',
entry: [
'react-hot-loader/patch',
'webpack-dev-server/client?http://localhost:8080',
'webpack/hot/only-dev-server',
'./app/index.js',
],
devServer: {
hot: true,
publicPath: '/public/',
proxy: {
"/api/**": "http://localhost:3333",
"/auth/**": "http://localhost:3333",
},
},
plugins: [
new webpack.HotModuleReplacementPlugin(),
new webpack.NamedModulesPlugin(),
],
} : {
devtool: 'inline-source-map',
entry: [
'./app/index.js',
],
plugins: [
new webpack.optimize.UglifyJsPlugin({
comments: false,
}),
new webpack.LoaderOptionsPlugin({
minimize: true,
}),
new webpack.optimize.AggressiveMergingPlugin(),
new CompressionPlugin({
asset: "[path].gz[query]",
algorithm: "gzip",
test: /\.js$|\.css$|\.html$/,
threshold: 10240,
minRatio: 0.8,
}),
],
})
}
Webpack在本地成功编译,但是当我尝试将其部署到Heroku时,在Papertrail中的输出如下所示:
> webpack --env=production & node start.js
Config did not export an object.
有什么想法吗?
webpack
配置吗?看起来像是一个dev
的配置。 - Ilanus