1、问题原因
用vuecli与vite创建的vue项目,默认是没有热部署更新的。而且查阅大量资料后仍然找不到解决方法
这个我认为是mac的m系列芯片的问题
为什么我会这么认为,因为相同的项目,node_moudules我都没有变过,再win系统中与mac系统同时运行,只有win系统是可以正常热部署的,mac就跟死了一样。这个问题真的是令人抓耳挠腮,浪费了我两台时间没想到就加加几行代码。
2、解决方法
2.1 vuecli
修改 [vue.config.js]文件
最主要的是添加如下代码:
configureWebpack: {
// 根级 watchOptions,作用于所有模块编译
watchOptions: {
poll: 1000, // 轮询间隔 ms
aggregateTimeout: 300, // 防抖时间 ms
ignored: /node_modules/
}
},
[vue.config.js]文件完整代码1(根据自己代码选择):
// vue.config.js
module.exports = {
// (一)Webpack 编译器监视改动
configureWebpack: {
// 根级 watchOptions,作用于所有模块编译
watchOptions: {
poll: 1000, // 轮询间隔 ms
aggregateTimeout: 300, // 防抖时间 ms
ignored: /node_modules/
}
},
devServer: {
hot: true,
// (二)静态资源监视(可选)
static: {
watch: true
},
// (三)额外路径监视(可选)
watchFiles: {
paths: ['src/**/*', 'public/**/*'],
options: {
usePolling: false // 这一项只影响 dev-server 的额外监视,不影响 Webpack 编译
}
},
// 网络 & WS 设置,确保 HMR 客户端能连上
host: '0.0.0.0',
allowedHosts: 'all',
client: {
webSocketURL: 'ws://0.0.0.0:8080/ws'
}
}
}
[vue.config.js]文件完整代码2(根据自己代码选择):
const { defineConfig } = require('@vue/cli-service')
module.exports = defineConfig({
transpileDependencies: true,
configureWebpack: {
// 根级 watchOptions,作用于所有模块编译
watchOptions: {
poll: 1000, // 轮询间隔 ms
aggregateTimeout: 300, // 防抖时间 ms
ignored: /node_modules/
}
},
})
2.2 vue-vite
在[vue.config.js]文件中添加如下监听
watch: {
usePolling: true, // 关键点!
}
[vue.config.js]文件完整代码
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
export default defineConfig({
plugins: [vue()],
server: {
host: '0.0.0.0', // 或 'localhost'
port: 5173,
watch: {
usePolling: true, // 关键点!
}
}
})
如下:
来源链接:https://www.cnblogs.com/2580p/p/18884193
© 版权声明
本站所有资源来自于网络,仅供学习与参考,请勿用于商业用途,否则产生的一切后果将由您(转载者)自己承担!
如有侵犯您的版权,请及时联系3500663466#qq.com(#换@),我们将第一时间删除本站数据。
如有侵犯您的版权,请及时联系3500663466#qq.com(#换@),我们将第一时间删除本站数据。
THE END
暂无评论内容