Skip to content

Instantly share code, notes, and snippets.

@magicspon
Created January 19, 2018 10:44
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save magicspon/bfbd9a420e2556a2b3eac8eda1dc3c7d to your computer and use it in GitHub Desktop.
Save magicspon/bfbd9a420e2556a2b3eac8eda1dc3c7d to your computer and use it in GitHub Desktop.
Webpack config - common chunks outputting arrow functions in generated js
/* 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