-
-
Save geroylaurence/5f2a2ec7ad8f18333a40537cf598b444 to your computer and use it in GitHub Desktop.
Webpack 4 Config
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
const fs = require('fs') | |
const path = require('path') | |
const webpack = require('webpack') | |
const WriteFilePlugin = require('write-file-webpack-plugin') | |
const res = p => path.resolve(__dirname, p) | |
const nodeModules = res('../node_modules') | |
const entry = res('../server/render.js') | |
const output = res('../buildServer') | |
// if you're specifying externals to leave unbundled, you need to tell Webpack | |
// to still bundle `react-universal-component`, `webpack-flush-chunks` and | |
// `require-universal-module` so that they know they are running | |
// within Webpack and can properly make connections to client modules: | |
const externals = fs | |
.readdirSync(nodeModules) | |
.filter(x => !/\.bin|react-universal-component|webpack-flush-chunks/.test(x)) | |
.reduce((externals, mod) => { | |
externals[mod] = `commonjs ${mod}` | |
return externals | |
}, {}) | |
externals['react-dom/server'] = 'commonjs react-dom/server' | |
module.exports = { | |
name: 'server', | |
devtool: 'source-map', | |
target: 'node', | |
mode: 'development', | |
entry: ['regenerator-runtime/runtime.js', entry], | |
externals, | |
output: { | |
path: output, | |
filename: '[name].js', | |
libraryTarget: 'commonjs2' | |
}, | |
module: { | |
rules: [ | |
{ | |
test: /\.js$/, | |
exclude: /node_modules/, | |
use: 'babel-loader' | |
}, | |
{ | |
test: /\.styl$/, | |
exclude: /node_modules/, | |
use: [ | |
{ | |
loader: 'css-loader', | |
options: { | |
modules: true, | |
localIdentName: '[name]__[local]--[hash:base64:5]', | |
exportOnlyLocals: true | |
} | |
}, | |
{ | |
loader: 'stylus-loader' | |
} | |
] | |
}, | |
{ // CSS | |
test: /\.(css|scss)$/, | |
use: ['to-string-loader', 'css-loader', 'sass-loader'], | |
}, | |
{ // Assets | |
test: /\.(png|svg|jpg|otf|mp4|gif|ttf|eot|woff|woff2)$/, | |
use: [ | |
{ | |
loader: 'file-loader', | |
options: { | |
publicPath: '/static', | |
}, | |
}, | |
], | |
}, | |
] | |
}, | |
resolve: { | |
extensions: ['.js', '.css', '.styl'] | |
}, | |
plugins: [ | |
new WriteFilePlugin(), | |
new webpack.optimize.LimitChunkCountPlugin({ | |
maxChunks: 1 | |
}), | |
new webpack.DefinePlugin({ | |
'process.env': { | |
NODE_ENV: JSON.stringify('development') | |
} | |
}) | |
] | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment