Description
I have an Angular 6 project where I want to use the mini-css-extract-plugin. Here is the relevant part of the webpack configuration:
module: {
rules: [
{
test: /(?:\.ngfactory\.js|\.ngstyle\.js|\.ts)$/,
loader: "@ngtools/webpack"
},
{ test: /\.html$/, loader: "raw-loader" },
{
test: /\.(png|gif|jpe?g|woff|woff2|eot|ttf|svg)$/,
loader: "url-loader?limit=100000"
},
{
test: /\.css$/,
use: [
MiniCssExtractPlugin.loader,
"css-loader"
]
}
]
},
plugins: [
new HtmlWebpackPlugin({
template: __dirname + "/src/index.html",
output: __dirname + "/dist",
inject: "head",
hash: true
}),
new MiniCssExtractPlugin({
filename: "[name].css"
}),
new OptimizeCSSAssetsPlugin({
assetNameRegExp: /\.optimize\.css$/g,
cssProcessor: require("cssnano"),
cssProcessorOptions: { discardComments: { removeAll: true } },
canPrint: true
}),
new UglifyJsPlugin({
parallel: 4,
sourceMap: true
}),
new AngularCompilerPlugin({
tsConfigPath: "./tsconfig.json",
entryModule: "src/app/app.module#AppModule",
skipCodeGeneration: false
})
]
Running webpack will fail with the following message:
ERROR in Module build failed (from ./node_modules/mini-css-extract-plugin/dist/loader.js):
TypeError: Cannot read property 'replace' of undefined
at normalizeBackSlashDirection (C:\node_modules\webpack\lib\RequestShortener.js:16:16)
at new RequestShortener (C:\node_modules\webpack\lib\RequestShortener.js:26:15)
at Compiler (C:\node_modules\webpack\lib\Compiler.js:137:27)
at Compiler.createChildCompiler (C:\node_modules\webpack\lib\Compiler.js:378:25)
at Compilation.createChildCompiler (C:\node_modules\webpack\lib\Compilation.js:1892:24)
at Object.pitch (C:\node_modules\mini-css-extract-plugin\dist\loader.js:77:43)
However, if I change the "skipCodeGeneration" property to true, no error is thrown and everything works normally.
Is this a bug?