Question

我正在尝试从客户端js代码动态加载整个应用程序。我不想发送将应用程序加载到浏览器所需的任何依赖项，除非调用该应用程序。

理想情况下，我也不需要使用包含编译器的构建。

import Vue from 'vue';
import App from './App.vue';

export default function fetchAppFromServer() {

Vue.component('App', () => import(/* webpackChunkName: "ui" */ './App.vue')
        .then((app) => console.log('here I am!', app))
);

    createDivForMount(); // this makes <div id="cmp-app"></div>

    const vm = new Vue(App).$mount('#cmp-app');
    Promise.resolve()
}

然后我会在另一个文件中调用：

logic1()
  .then(result => logic2)
  .then(fetchAppFromServer())

编辑：从下面的评论我只是扩展问题是什么，主要是上面的代码不起作用:)，我无法：

调用函数时加载应用程序。
创建一个webpack代码拆分指向生成仅包含UI的新文件

Vuejs，Webpack＆amp;动态导入，整个应用程序

0 个答案: