Win10 Laravel-Mix 热更新

在 Mac 上好好的前端项目,为何移植到 windows 上就打包失败了呢?
为什么 Laravel-Mix 在 Windows 上不能启动 hmr 呢??

原来还需要进行以下配置啊。

前情提要

公司新入职了一个前端,clone下来前端项目后发现无法运行。 惊!!随查看是什么原因。
初步发现是windows环境的原因, 文件路径的 \/ 问题
再测试发现无法启动hmr导致无法热更新
于是乎各种google各种解决,最后找到了解决方案

项目相关配置

1
2
3
4
npm 6.1.0
node v12.6.0
laravel-mix 2.0.0
webpack-cli 2.0.10

执行命令

1
npm run hot

解决方案

webpack.min.js 文件里增加如下代码:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
Mix.listen('configReady', (webpackConfig) => {
if (Mix.isUsing('hmr')) {
// Remove leading '/' from entry keys
webpackConfig.entry = Object.keys(webpackConfig.entry).reduce((entries, entry) => {
entries[entry.replace(/^\//, '')] = webpackConfig.entry[entry];

return entries;
}, {});

// Remove leading '/' from ExtractTextPlugin instances
webpackConfig.plugins.forEach((plugin) => {
if (plugin.constructor.name === 'ExtractTextPlugin') {
plugin.filename = plugin.filename.replace(/^\//, '');
}

if (plugin.constructor.name === 'CommonsChunkPlugin') {
plugin.chunkNames = plugin.chunkNames.map(name => {
return name.replace(/^\//, '');
});
}
});
}
})

重新启动项目看看,发现好了~~

PS

windows下编程最好还是搞个虚拟机,路径问题或者其他问题解决起来太不友好了。。。

咸鱼也要有梦想,万一实现了呢
0%