Skip to content

Instantly share code, notes, and snippets.

@pts-moog16
Last active May 6, 2021 20:48
Show Gist options
  • Save pts-moog16/c0c52d6fe050b5f4a9a73efab6cc14f9 to your computer and use it in GitHub Desktop.
Save pts-moog16/c0c52d6fe050b5f4a9a73efab6cc14f9 to your computer and use it in GitHub Desktop.
Webpack config for bundling javascript files
const path = require('path');
const merge = require('webpack-merge');
const webpack = require('webpack');
// args.getArgs is a custom function that I wrote for yarn
const args = require('./build/utils/args');
// ENV Variables
const client = args.getArg('client') || 'default';
const stubs = args.getArg('stubs');
const PORT = 8080;
const localhost = 'http://127.0.0.1';
const PATHS = {
app: path.join(__dirname, 'src/index.js')
};
// Common loaders, options, plugins that are for my production and development build
const commonLoaders = {
module: {
rules: [
{
test: /\.js$/,
exclude: /(node_modules)/,
loader: 'babel-loader',
options: {
presets: [
['es2015', {modules: false}],
'react'
],
plugins: [ 'react-hot-loader/babel' ]
}
}
]
},
plugins: [ new ProgressBarPlugin() ]
};
// the development or production config that I use in Gulpfile.js
module.exports = function(TARGET) {
switch(TARGET) {
case 'build:all':
return getConfigProd();
default:
return getConfigDev();
}
}
// Production build configuration
function getConfigProd() {
return merge(commonLoaders, {
entry: ['babel-polyfill', PATHS.app],
output: {
path: path.resolve(__dirname, 'static'),
publicPath: '/static/',
filename: "[name].[hash].bundle.js",
},
plugins: [
new webpack.optimize.UglifyJsPlugin({ /*... options ... */ })
]
}
);
}
// Development build configuration
function getConfigDev() {
return merge(commonLoaders, {
entry: [
'react-hot-loader/patch',
`webpack-dev-server/client?${localhost}:${PORT}`,
'webpack/hot/only-dev-server',
'babel-polyfill',
PATHS.app
],
watch: true,
devtool: 'eval',
output: {
path: path.resolve(__dirname, 'static'),
publicPath: '/',
filename: 'bundle.js'
}
},
require('./build/getDevServerConfig')(PORT, localhost, client)
);
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment