最大调用堆栈大小 Vite/Page 不断重新加载

Question

我将 vite 与 rails 一起使用，并像这样加载我的自定义组件：

main.js

import { defineCustomElement } from 'vue';
import Panel from '~/components/panel_custom/Panel.ce.vue';


const CustomElement = defineCustomElement(Panel);
window.customElements.define('panel-custom', CustomElement);

erb 文件

<panel-custom data="<%= props %>"></panel-custom>

<%= vite_javascript_tag 'note_panel' %>

现在打开页面时，它会永久重新加载。在评论我的组件的导入时，连续重新加载停止。我认为这可能是组件本身的问题，但评论所有 javascript 并没有解决问题。即使使用空组件也无法解决问题。包含自定义组件有问题吗？

编辑：

问题可能是vite的HMR。设置：

server: {
    hmr: false
  },

在vite.config.js至少解决了一个组件的问题。但也禁用了 hmr...

Answer 1

问题出在 vite.json 使用 Docker 时。缺少主机配置：

  "development": {
    "autoBuild": true,
    "publicOutputDir": "vite-dev",
    "port": 3036,
    "host": "0.0.0.0"
  },

最大调用堆栈大小 Vite/Page 不断重新加载

Maximum callstack size Vite / Page keeps reloading

docker

vue.js

vite