webpack.watch环境下,less中@import的less出现语法错误之后watch对此文件失效
下面被@import的_var.less, _common.less里出现的错误被抛出之后,
在错误改正之后,webpack.watch中的回调不会再次执行,
必须修改其他的less 或者其他的js,或者重启webpack才能生效,
就是说webpack.watch不再监视这个已经报了错的less文件了(只有@import里面的less会出现这个问题),
身为一个强迫症感觉出现这种情况很是头疼啊(╯‵□′)╯︵┻━┻
不知道各位大佬又没有遇到过这类情况,英语不好,查了google好久也没找到解决方案,特此求助
less如下:
@import './common/_var';
@import './common/_commom';
less-loader代码:
{ //less解析器配置, less需要用到两种解析器共同作用
test: /\.(less)$/,
loader: ExtractLess.extract([ //调用css分离打包
{
loader: 'css-loader',
options: {
sourceMap: true, //启用sourceMap
minimize: process.env.NODE_ENV === 'production' //启用最小代码压缩
}
},
{
loader: 'less-loader',
options: {
sourceMap: true, //启用sourceMap
paths: [ //配置less默认引入路径
path.resolve(__dirname, "../src/less"),
path.resolve(__dirname, "../node_modules")
]
}
}
])
}
webpack watch代码:
var webpack = require('webpack'); //引入webpack
var browserSync = require('browser-sync').create(); //引入并创建代理服务器插件
var merge = require('webpack-merge'); //引入webpack配置文件合并插件
var baseConfig = require('./webpack.base.conf'); //引入基础config文件
process.env.NODE_ENV = "development"
var config = merge(baseConfig, { //合并新的config文件
devtool: 'source-map' //设置调试模式,用于输出便于调试的sourceMap文件
})
var compiler = webpack(config); //实例化webpack
browserSync.init({ //初始化服务器
proxy: "http://www.example.com" //设置服务器代理到php服务器域名
})
compiler.watch({ //启用webpack的监听文件变动模式
aggregateTimeout: 300, // wait so long for more changes
poll: true // use polling instead of native watchers
}, function(err,stats){
if(err)
return console.log(err);
var jsonStats = stats.toJson();
if(jsonStats.errors.length > 0)
return console.log(jsonStats.errors);
if(jsonStats.warnings.length > 0)
console.log('has warning');
// console.log(jsonStats.warnings);
browserSync.reload();
})
webpack版本:3.5.6
less-loader版本:4.0.5
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论