javascript - VueJS - 将单独的组件加载到 vue 实例中

Question

在我的工作中，我目前正在重新设计我们的网络平台，包括将大量旧的 javascript/jquery 移至 VueJS。

我有一个包含 Vue 组件的 global.js 文件，还有一个包含 Vue 的 vendor.js， Axios、Vuex、...

现在我们的网站上有一个文本编辑器，这个编辑器有一个 Vue 版本。问题是这个文本编辑器非常大，几乎 500kb 用于生产。所以我在单独的文件中为此编辑器创建了一个单独的组件，因为我们只需要在两个页面上使用它。

现在，由于我的全局 Vue 占据了整个页面，我无法将文本编辑器插入其中，因为您无法将 Vue 实例放入另一个 Vue 实例。

有没有一种方法可以让编辑器作为一个完全独立的文件，但在页面上加载时以某种方式使用全局 Vue 实例？

我已经搜索了很多，但没有在任何地方遇到过这个问题。也许这是不可能的。

Answer 1

尝试异步加载 TextEditor.vue。

new Vue({
  // ...
  components: {
    TextEditor: () => import("./TextEditor.vue")
  }
})

Reference .