<p>您好,我的 vue 项目遇到问题。</p>
<p>我在 docker 中有前端后端和后端数据库。</p>
<p>这是 vue.config.js 配置:</p>
<pre class="brush:php;toolbar:false;">module.exports = defineConfig({
configureWebpack: {
entry: "./src/main.js",
devServer: {
hot: true,
},
watch: true,
watchOptions: {
ignored: /node_modules/,
poll: 500,
},
},
transpileDependencies: true
})</pre>
<p>容器在创建过程中会自行安装 npm 和 package.json 中给出的包:</p>
<pre class="brush:php;toolbar:false;">{
"name": "frontend",
"version": "0.1.0",
"private": true,
"scripts": {
"serve": "vue-cli-service serve",
"build": "vue-cli-service build",
"lint": "vue-cli-service lint"
},
"dependencies": {
"@morioh/v-smooth-scrollbar": "^1.0.3",
"@vuepic/vue-datepicker": "^4.2.0",
"@vueuse/core": "^9.13.0",
"ajax": "^0.0.4",
"axios": "^1.3.3",
"core-js": "^3.8.3",
"mitt": "^3.0.0",
"register-service-worker": "^1.7.2",
"smoothscroll-polyfill": "^0.4.4",
"vue": "^3.2.13",
"vue-axios": "^3.5.2",
"vue-class-component": "^8.0.0-0",
"vue-router": "^4.0.3",
"vuex": "^4.0.0"
},
“开发依赖项”:{
“@typescript-eslint/eslint-plugin”:“^5.4.0”,
“@typescript-eslint/parser”:“^5.4.0”,
“@vue-leaflet/vue-leaflet”:“^0.8.4”,
“@vue/cli-plugin-babel”:“~5.0.0”,
“@vue/cli-plugin-eslint”:“~5.0.0”,
“@vue/cli-plugin-pwa”:“~5.0.0”,
“@vue/cli-plugin-router”:“~5.0.0”,
“@vue/cli-plugin-typescript”:“~5.0.0”,
“@vue/cli-plugin-vuex”:“~5.0.0”,
“@vue/cli-service”:“~5.0.0”,
“@vue/eslint-config-typescript”:“^9.1.0”,
“eslint”:“^7.32.0”,
“eslint-plugin-vue”:“^8.0.3”,
“传单”:“^1.9.3”,
“sass”:“^1.32.7”,
“sass-loader”:“^12.0.0”,
“打字稿”:“~4.5.5”
},
“eslintConfig”:{
“根”:正确,
“环境”:{
“节点”:真
},
“扩展”:[
“插件:vue/vue3-essential”,
“eslint:推荐”,
“@vue/typescript/推荐”
],
“解析器选项”:{
“ecma版本”:2020
},
“规则”:{}
},
“浏览器列表”:[
”“ 1%”,
“最后 2 个版本”,
“没有死”,
“不是11”
]
}</pre>
<p>我发布了所有内容,这样就不会造成混乱:)</p>
<p>直到昨天,一切对我来说一切都正常,但是今天重新启动容器后,页面的热重新加载选项停止工作。</p>
<p>当容器启动时,我得到以下输出:</p>
前端 | 应用程序运行于:
前端| - 本地:http://localhost:8080/
前端| - 网络:http://172.26.0.4:8080/
前端|
未发现问题。
<p>当我使用 http://localhost:8080 在浏览器中启动页面时,页面会加载,但保存更改时的实时重新加载选项已停止工作。</p>
<p>在控制台中我可以看到浏览器尝试下载更新但没有得到响应</p>
<pre class="brush:php;toolbar:false;">WebSocket connection to 'ws://172.26.0.4:8080/ws' failed:
WebSocketClient @ WebSocketClient.js?5586:16
initSocket @ socket.js?d6e0:24
eval @ socket.js?d6e0:48</pre>
<p>我尝试从头开始放置容器。</p>
<p>我使用了旧版本的 kyod,但在撰写后此选项仍然不起作用</p>
<p>当我手动刷新页面时,内容会正确更改。</p>
<p>你知道问题出在哪里吗</p>
<p>此外,在其他计算机上它也可以正常工作。</p>
<p>他们编译整个项目的时间比我晚,所以如果它依赖于某些节点模块,它也将无法工作。
不管怎样,我已经尝试自己从头开始创建容器两天了,所以没有任何node_模块是过时的。
问题不在配置中,因为一天前它还可以工作。
或者我的电脑上是否有某些内容可能会阻止 ws://172.26.0.4:8080/ws 的流量</p>
<p>此外,它在其他浏览器上看起来是相同的。</p>
<p>我目前正在安装一个虚拟机来检查它仍然像这样,但很想听听关于我还可以检查什么的建议。</p>
<p>感谢您的提前互动并期待您!</p>
其他信息:
这是我的容器检查:
]