How to use webpack-config-utils - 10 common examples
To help you get started, we’ve selected a few webpack-config-utils examples, based on popular ways it is used in public projects.
Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
arogozine / LinqToTypeScript / config / rollup.config.js View on Github 
import replace from 'rollup-plugin-replace'
import { uglify } from 'rollup-plugin-uglify'
import { terser } from 'rollup-plugin-terser'
import { getIfUtils, removeEmpty } from 'webpack-config-utils'
import { peerDependencies } from '../package.json'
/**
* @typedef {import('./types').RollupConfig} Config
*/
/**
* @typedef {import('./types').RollupPlugin} Plugin
*/
const env = process.env.NODE_ENV || 'development'
const { ifProduction } = getIfUtils(env)
const ROOT = resolve(__dirname, '..')
const DIST = resolve(ROOT, 'dist') //
/**
* Object literals are open-ended for js checking, so we need to be explicit
* @type {{entry:{esm2015: string, cjs: string},bundles:string}}
*/
const PATHS = {
entry: {
cjs: resolve(DIST, 'cjs'),
esm2015: resolve(DIST, 'esm2015'),
},
bundles: resolve(DIST, 'bundles'),
}plugins: [
'transform-object-rest-spread',
'transform-class-properties'
],
babelrc: false,
cacheDirectory: false
}
},
{
test: /\.js$/,
loader: 'eslint-loader',
exclude: /node_modules/
}
]
},
plugins: removeEmpty([
new ProgressBarPlugin(),
new webpack.DefinePlugin({
'process.env': {
NODE_ENV: env === 'production' ? '"production"' : '"development"'
}
})
])
}
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(
hotchunks.push(plugin)
})
/*
|--------------------------------------------------------------------------
| return webpack config object
|--------------------------------------------------------------------------
*/
export default {
// we have to use source map for css source maps, slightly longer compile times
// devtool: 'source-map',
context: BASE_PATH,
// entry is a function so that we can use environment variables
entry: removeEmpty(entryPoints),
output: {
path: outputPath,
publicPath: '',
filename: ifProduction(
assetsPath('js/[name].js')
),
chunkFilename: assetsPath('js/[id].js')
},
resolve: {
extensions: ['.js', '.json', '.vue'],
modules: [resolve(config.src.base), resolve('node_modules')],
alias: {
src: resolve(config.src.base)
}
},
module: {module.exports = function(env) {
var { ifProduction, ifNotProduction } = getIfUtils(env);
return {
devtool: ifProduction('source-map', 'eval'),
entry: {
main: './index.js',
vendor: [
'react',
'react-dom',
'react-router'
]
},
output: {
filename: ifProduction(
'bundle.[name].[chunkhash].js',
'bundle.[name].js'
),module.exports = function(env) {
var { ifProduction, ifNotProduction } = getIfUtils(env);
return {
devtool: ifProduction('source-map', 'eval'),
entry: {
main: './index.js',
vendor: [
'react',
'react-dom',
'react-router'
]
},
output: {
filename: ifProduction(
'bundle.[name].[chunkhash].js',
'bundle.[name].js'
),module.exports = function(env) {
var { ifProduction, ifNotProduction } = getIfUtils(env);
return {
devtool: ifProduction('source-map', 'eval'),
entry: {
main: './index.js',
vendor: [
'react',
'react-dom',
'react-router'
],
material: [
'material-ui',
'material-ui/svg-icons',
'material-ui/svg-icons/content/add',
'material-ui/List',
'material-ui/svg-icons/navigation/more-vert',module.exports = function(env) {
var { ifProduction, ifNotProduction } = getIfUtils(env);
return {
devtool: ifProduction('source-map', 'eval'),
entry: {
main: './index.js',
vendor: [
'react',
'react-dom',
'react-router'
]
},
output: {
filename: ifProduction(
'bundle.[name].[chunkhash].js',
'bundle.[name].js'
),module.exports = function(env) {
var { ifProduction, ifNotProduction } = getIfUtils(env);
return {
devtool: ifProduction('source-map', 'eval'),
entry: {
main: './index.js',
vendor: [
'react',
'react-dom',
'react-router'
]
},
output: {
filename: ifProduction(
'bundle.[name].[chunkhash].js',
'bundle.[name].js'
),loader: 'file-loader',
options: {
name: ifProduction(
'assets/fonts/[name].[hash:8].[ext]',
'assets/fonts/[name].[ext]'
)
}
}
},
{
test: /\.json/,
use: 'json-loader'
}
]
},
plugins: removeEmpty([
new webpack.DefinePlugin({
__LORE_ROOT__: JSON.stringify(__dirname),
'process.env': {
'NODE_ENV': JSON.stringify(env)
}
}),
new ProgressBarPlugin(),
new ExtractTextPlugin(ifProduction(
'styles.[name].[chunkhash].css',
'styles.[name].css'
)),
ifProduction(new ManifestPlugin({
fileName: 'asset-manifest.json'
})),
ifProduction(new webpack.optimize.CommonsChunkPlugin({
names: [loader: 'file-loader',
options: {
name: ifProduction(
'assets/fonts/[name].[hash:8].[ext]',
'assets/fonts/[name].[ext]'
)
}
}
},
{
test: /\.json/,
use: 'json-loader'
}
]
},
plugins: removeEmpty([
new webpack.DefinePlugin({
__LORE_ROOT__: JSON.stringify(__dirname),
'process.env': {
'NODE_ENV': JSON.stringify(env)
}
}),
new ProgressBarPlugin(),
new ExtractTextPlugin(ifProduction(
'styles.[name].[chunkhash].css',
'styles.[name].css'
)),
ifProduction(new ManifestPlugin({
fileName: 'asset-manifest.json'
})),
ifProduction(new webpack.optimize.CommonsChunkPlugin({
names: [webpack-config-utils
Utilities to help your webpack config be easier to read
