How to use @webpack-blocks/webpack - 10 common examples
To help you get started, we’ve selected a few @webpack-blocks/webpack 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.
andywer / webpack-blocks / test-app / webpack.plugins.js View on Github 
const { webpack } = require('@webpack-blocks/webpack')
const HtmlWebpackPlugin = require('html-webpack-plugin')
exports.basePlugins = [
new HtmlWebpackPlugin({
inject: true,
template: './index.html'
})
]
exports.productionPlugins = [
new webpack.LoaderOptionsPlugin({
minimize: true,
debug: false
}),
// new webpack.optimize.DedupePlugin(), // TODO: Does not work w/ webpack 2 yet... :-/
new webpack.optimize.UglifyJsPlugin({
compress: {
warnings: false
},
output: {
comments: false
},
screwIe8: true,
sourceMap: false
})
]const HtmlWebpackPlugin = require('html-webpack-plugin')
exports.basePlugins = [
new HtmlWebpackPlugin({
inject: true,
template: './index.html'
})
]
exports.productionPlugins = [
new webpack.LoaderOptionsPlugin({
minimize: true,
debug: false
}),
// new webpack.optimize.DedupePlugin(), // TODO: Does not work w/ webpack 2 yet... :-/
new webpack.optimize.UglifyJsPlugin({
compress: {
warnings: false
},
output: {
comments: false
},
screwIe8: true,
sourceMap: false
})
]exclude: /node_modules/
}),
env('development', [
devServer([
`webpack-dev-server/client?http://localhost:${WEBPACK_DEV_PORT}`,
'webpack/hot/only-dev-server'
]),
devServer.proxy({
'*': { target: `http://localhost:${DEV_PORT}` }
}),
devServer.reactHot({
exclude: /node_modules/
}),
sourceMaps()
]),
env('production', [
addPlugins([
// Try to dedupe duplicated modules, if any:
new webpack.optimize.DedupePlugin(),
// Minify the code.
new webpack.optimize.UglifyJsPlugin({
compress: {
screw_ie8: true, // React doesn't support IE8
warnings: false
},
mangle: {
screw_ie8: true
},
output: {
comments: false,
screw_ie8: true
}}),
cssLoader(),
addPlugins([
// This helps ensure the builds are consistent if source hasn't changed:
new webpack.optimize.OccurenceOrderPlugin(),
new webpack.DefinePlugin({
'process.env': {
NODE_ENV: JSON.stringify(ENV)
}
}),
new ManifestPlugin()
]),
babel({
exclude: /node_modules/
}),
env('development', [
devServer([
`webpack-dev-server/client?http://localhost:${WEBPACK_DEV_PORT}`,
'webpack/hot/only-dev-server'
]),
devServer.proxy({
'*': { target: `http://localhost:${DEV_PORT}` }
}),
devServer.reactHot({
exclude: /node_modules/
}),
sourceMaps()
]),
env('production', [
addPlugins([
// Try to dedupe duplicated modules, if any:
new webpack.optimize.DedupePlugin(),compress: {
warnings: false
}
}
}),
addPlugins([
new CleanWebpackPlugin([appPath('build')], {
root: process.cwd()
}),
new CopyWebpackPlugin([{ from: 'public', to: '' }])
])
])
]),
userConfig,
createConfig([
env('test', [
customConfig({
target: 'node',
externals: [nodeExternals()],
output: {
// use absolute paths in sourcemaps (important for debugging via IDE)
devtoolModuleFilenameTemplate: '[absolute-resource-path]',
devtoolFallbackModuleFilenameTemplate:
'[absolute-resource-path]?[hash]'
},
module: {
rules: [
{
test: /\.(jsx?|tsx?)/,
include: packageJson.nyc.include.map(p =>
path.resolve(appPath(p))
),uglifyOptions: {
compress: {
warnings: false
}
}
}),
addPlugins([
new CleanWebpackPlugin([appPath('build')], {
root: process.cwd()
}),
new CopyWebpackPlugin([{ from: 'public', to: '' }])
])
])
]),
userConfig,
createConfig([
env('test', [
customConfig({
target: 'node',
externals: [nodeExternals()],
output: {
// use absolute paths in sourcemaps (important for debugging via IDE)
devtoolModuleFilenameTemplate: '[absolute-resource-path]',
devtoolFallbackModuleFilenameTemplate:
'[absolute-resource-path]?[hash]'
},
module: {
rules: [
{
test: /\.(jsx?|tsx?)/,
include: packageJson.nyc.include.map(p =>
path.resolve(appPath(p))const webpack = require('webpack')
const { uglify } = require('webpack-blocks')
const {
createConfig, defineConstants, env, addPlugins,
entryPoint, setOutput, sourceMaps,
customConfig,
} = require('@webpack-blocks/webpack')
const path = require('path')
const devServer = require('@webpack-blocks/dev-server')
// const cssModules = require('./tools/webpack-blocks/css-loader')
const DIST = `${__dirname}/static/dist`
module.exports = createConfig([
entryPoint({
vendor: ['./src/vendor.ts'],
}),
setOutput({
filename: '[name].dll.js',
path: DIST,
publicPath: '/static/dist',
library: '[name]', // needed for dll plugin
}),
// cssModules(),
defineConstants({
'process.env.NODE_ENV': process.env.NODE_ENV,
}),
customConfig({
resolve: {
extensions: ['.ts', '.tsx', '.js'],const cssLoader = include => {
return context => ({
module: {
loaders: [
{
test: /\.css$/,
loader: ExtractTextPlugin.extract('style-loader', 'css-loader')
}
]
},
plugins: [new ExtractTextPlugin(CSS_OUTPUT_FILENAME)]
})
}
export default createConfig([
entryPoint(path.join(__dirname, WEB_APP_ENTRY_POINT)),
setOutput({
path: path.join(__dirname, WEB_APP_DIR, OUTPUT_PATH),
publicPath: '/_diag/',
filename: JS_OUTPUT_FILENAME
}),
cssLoader(),
addPlugins([
// This helps ensure the builds are consistent if source hasn't changed:
new webpack.optimize.OccurenceOrderPlugin(),
new webpack.DefinePlugin({
'process.env': {
NODE_ENV: JSON.stringify(ENV)
}
}),
new ManifestPlugin()
]),name = 'vendor',
test = /\.js$/,
exclude,
} = typeof options === 'object' ? options : ({ name: options }: Options)
return group([
setOutput({
filename: '[name].js',
}),
addPlugins([
new webpack.optimize.CommonsChunkPlugin({
name,
minChunks: ({ resource }) => isVendor(resource, test, exclude),
}),
]),
env('production', [
setOutput({
filename: '[name].[chunkhash].js',
}),
addPlugins([
new WebpackMd5Hash(),
]),
]),
])
}new HtmlWebpackHarddiskPlugin({
outputPath: appPath('public')
}),
new webpack.ProvidePlugin({
Snabbdom: 'snabbdom-pragma'
})
]),
env('development', [
devServer({
port: PORT,
contentBase: appPath('public')
}),
sourceMaps(),
addPlugins([new webpack.NamedModulesPlugin()])
]),
env('production', [
uglify({
parallel: true,
cache: true,
uglifyOptions: {
compress: {
warnings: false
}
}
}),
addPlugins([
new CleanWebpackPlugin([appPath('build')], {
root: process.cwd()
}),
new CopyWebpackPlugin([{ from: 'public', to: '' }])
])
])@webpack-blocks/webpack
Webpack block for the webpack 2.x base configuration.
