我为SASS和Babel构建自定义webpack配置。在我的webpack dev服务器中,它显示
获取http://localhost:8082/dist/bundle.css net :: ERR_ABORTED
在控制台中,虽然它正在运行。我已经添加了publicPath,但它仍然显示此错误。
var path = require('path');
var ExtractTextPlugin = require('extract-text-webpack-plugin');
//Check production environment
var isProd = process.env.NODE_ENV === 'production';
// Use CSS loader based on env
var cssDev = ['style-loader', 'css-loader']
var scssDev = ['style-loader', 'css-loader', 'sass-loader']
var cssProd = ExtractTextPlugin.extract({
fallback: 'style-loader',
use: ['css-loader', 'sass-loader'],
publicPath: '/dist'
})
var cssConfig = isProd ? cssProd : cssDev
var scssConfig = isProd ? cssProd : scssDev
module.exports = {
entry: './src/js/bootstrap.js',
output: {
path: path.resolve(__dirname, 'dist'),
filename: 'bundle.js',
publicPath: '/dist'
},
module: {
rules: [
{
test: /\.js$/,
use: [
{
loader: 'babel-loader',
options: {
presets: ['env']
}
}
]
},
{
test: /\.scss$/,
use: scssConfig
},
{
test: /\.css$/,
use: cssConfig
}
]
},
plugins: [
new ExtractTextPlugin({
filename: 'bundle.css',
disable: !isProd
}),
]
};
此外,热重新加载仅在css或js更改时有效。 html更改时如何自动重新加载?