Javascript 在HTML中一次性使用的大型Vue组件

我有一个编辑器vue组件

，我只想在几个站点上使用它。这个组件相当大（400kb），所以我不想全局注册它。有办法做到这一点吗？该网站是一个使用普通刀片服务器的传统服务器端应用程序

---

我正在考虑只在使用它的站点上手动导入它。

只需添加如下

编辑器组件：

...
import EditorComponent from 'path/to/editor/'

export default {
  components: {
    'editor': EditorComponent
  }
}
...

然后您可以在HTML中使用
。
将您的javascript与Webpack组合在一起，这样您只需在前端加载所需内容。

然后使用不同的新Vue函数仅渲染所需的内容

import Editor from './Editor.vue'
import OtherVueInstance from './OtherVueInstance.vue'
window.onload = function () {
    if (pageContainsEditor) {
        new Vue({
            render: h => h(Editor)
        }).$mount('#editor');   
    } else if (somethingElse) {
        new Vue({
            render: h => h(OtherVueInstance)
        }).$mount('#OtherVueInstance');   
    }
}



在刀片文件中：

<div id="editor"></div>
<div id="OtherVueInstance"></div>



您还可以创建一个全新的Vue应用程序，使用单独的JS和CSS。然后将其加载到需要的页面上。
只需将编辑器组件用作

与此相反：

从“./Editor”导入编辑器
导出默认值{
组成部分：{
编辑
}
}

这样做：

导出默认值{
组成部分：{
编辑器：（）=>导入（'./编辑器'）
}
}

Webpack会将编辑器组件代码分割成单独的块，Vue只会在实际需要时按需加载…
是的，在这些特定视图/组件中手动导入将是一个不错的选择。你有关于如何实现这一点的资源吗？但网站本身不是Vue组件，它是普通的bladeOh，你没有提到blade。我认为这是一个纯vue项目。对不起，我不得不说“该网站是一个传统的服务器端应用程序。”在你的问题中添加这一点，以便其他人可以帮助你。我不知道该怎么做。