为类似生产环境的vue.js网站禁用带有原始加载程序的热加载

Question

我有一个遗留的vue.js应用程序在暂存和测试服务器上运行。

问题是网络控制台在浏览器中收到了https://localhost/sockjs-node/info?t=1602594418799请求，当然，这些请求会失败，因为它们引用了浏览器中不可用的URL。

我想完全禁用一些类似生产(但不完全是(环境的HMR。

该网站收到以下命令：yarn vue-cli-service serve --port 8080 --mode production

出于某种原因，单独的mode production并不能禁用HMR。

我尝试了不同的方法，就像在网上推荐的那样。

所以，

module.exports = {
devServer: {
hot: false,
liveReload: false
}
}

禁用devServer运行模式的实际热刷新，但不禁用HMR-仍然可以看到那些/info请求。

另一种解决方案：

chainWebpack: config => {
config.module
.rule('vue')
.use('vue-loader')
.loader('vue-loader')
.tap(options => {
options.hotReload = false
return options
})
}

在我的情况下不起作用："无法设置未定义的属性hotReload"，可能是因为我的项目使用了"原始加载程序"而不是vue-loader。

另一个解决方案：

chainWebpack: config => {
config.plugins.delete('hmr');
},

不起作用。不知道为什么。

还有一个解决方案：

process.env.NODE_ENV === 'production'

这是有效的，不再有/info垃圾邮件。

但有一个问题。我需要像staging、testing这样的NODE_ENV，并希望禁用这些的HMR。

我该怎么做？如何告诉vue.js和/或webpack以与production相同的方式处理NODE_ENVstaging等？或者，如何根据其他自定义环境变量禁用HMR？

Answer 1

所以，我能做的最好的事情似乎是运行yarn build，然后在nginx、Apache或nodejs静态HTML服务器上提供dist文件夹。

仍然很奇怪的是，当我使用mode production通过vue-cli运行网站时，为什么vue.js(或webpack或其他什么(的行为不一样。

这是不直观的；我希望mode production的工作方式与构建网站并在任何其他服务器上托管后完全相同。