Created
January 19, 2018 10:44
-
-
Save magicspon/bfbd9a420e2556a2b3eac8eda1dc3c7d to your computer and use it in GitHub Desktop.
Webpack config - common chunks outputting arrow functions in generated js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* global */ | |
const webpack = require('webpack') | |
const path = require('path') | |
const ProgressBarPlugin = require('progress-bar-webpack-plugin') | |
const querystring = require('querystring') | |
const { removeEmpty } = require('webpack-config-utils') | |
const UglifyJsPlugin = require('uglifyjs-webpack-plugin') | |
let BundleAnalyzerPlugin = require('webpack-bundle-analyzer') | |
.BundleAnalyzerPlugin | |
module.exports = env => { | |
const context = path.resolve( | |
process.env.PWD, | |
PATH_CONFIG.src, | |
PATH_CONFIG.js.src | |
) | |
const dest = path.resolve( | |
process.env.PWD, | |
PATH_CONFIG.public, | |
PATH_CONFIG.js.dest | |
) | |
const { filename, entries, hot } = TASK_CONFIG.js | |
const config = { | |
entry: entries, | |
cache: true, | |
context: context, | |
output: { | |
path: path.normalize(dest), | |
jsonpFunction: 'webpackJsonp', | |
publicPath: PATH_CONFIG.js.publicPath, | |
pathinfo: env !== 'production' && true, | |
filename: | |
env === 'production' | |
? `[name].${filename}.${TASK_CONFIG.stamp}.js` | |
: `[name].${filename}.js`, | |
chunkFilename: '[name].[chunkhash].js' | |
}, | |
resolve: { | |
alias: { | |
'@': context | |
} | |
}, | |
devtool: | |
env === 'production' ? 'source-map' : 'eval-cheap-module-source-map', | |
module: { | |
loaders: [ | |
{ | |
test: /\.js?$/, | |
loader: 'babel-loader', | |
exclude: /node_modules/, | |
query: { | |
presets: [ | |
[ | |
'stage-0' | |
// { | |
// useBuiltIns: 'entry', | |
// targets: { | |
// browsers: [ | |
// 'last 2 versions', | |
// 'safari >= 7', | |
// 'Explorer 11', | |
// 'last 4 Edge versions' | |
// ] | |
// } | |
// } | |
], | |
'react' | |
], | |
plugins: [ | |
'transform-object-rest-spread', | |
'transform-class-properties', | |
'syntax-dynamic-import' | |
], | |
babelrc: false, | |
cacheDirectory: false | |
} | |
}, | |
{ | |
test: /\.js$/, | |
loader: 'eslint-loader', | |
exclude: /node_modules/ | |
} | |
] | |
}, | |
plugins: removeEmpty([ | |
new BundleAnalyzerPlugin({ | |
analyzerMode: 'static' | |
}), | |
new ProgressBarPlugin(), | |
new webpack.DefinePlugin({ | |
'process.env': { | |
NODE_ENV: env === 'production' ? '"production"' : '"development"' | |
} | |
}), | |
new webpack.optimize.CommonsChunkPlugin({ | |
name: 'common', | |
minChunks: function(module) { | |
return module.context && module.context.includes('node_modules') | |
} | |
}), | |
new webpack.optimize.CommonsChunkPlugin({ | |
name: 'manifest', | |
minChunks: Infinity | |
}) | |
]) | |
} | |
if (env === 'development') { | |
// Create new entry object with webpack-hot-middleware and react-hot-loader (if enabled) | |
if (!hot || hot.enabled !== false) { | |
for (let key in entries) { | |
const entry = [] | |
const hotMiddleware = `webpack-hot-middleware/client?${querystring.stringify( | |
hot | |
)}` | |
if (hot.react) { | |
entry.push('react-hot-loader/patch') | |
} | |
entries[key] = entry.concat(hotMiddleware, entries[key]) | |
} | |
config.plugins.push(new webpack.HotModuleReplacementPlugin()) | |
} | |
} | |
if (env === 'production') { | |
config.plugins.push( | |
// new UglifyJsPlugin({ | |
// sourceMap: true, | |
// uglifyOptions: { | |
// ecma: 8, | |
// compress: { | |
// warnings: false | |
// } | |
// } | |
// }), | |
new webpack.NoEmitOnErrorsPlugin() | |
) | |
} | |
return config | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment