Javascript 如何通过完整URL异步导入VueJS中的组件

我需要通过与相对URL相反的完整URL异步导入Vue组件。以下示例取自同一项目中的组件

Vue.component(
  'app-component-one',
  () => import('./component-from-app-one')
)

但是，我的目标是从部署在同一服务器上的单独项目导入组件。我希望我可以使用完整的网址，做一些像

Vue.component(
  'app-component-two',
   () => import ('http://sample-domain.com/project-2/components/component-from-app-two.vue')
)

但它会导致以下错误：

This dependency was not found:
* http://sample-domain.com/app-2/components/component-from-app-two.vue in ./node_modules/babel-loader/lib!./node_modules/vue-loader/lib/selector.js?type=script&index=0&bustCache!./src/components/SampleComponent.vue

---

是否可以通过完整URL导入组件？提前谢谢

您在Vue网站上引用的示例是利用，因此加载不属于同一项目的文件将不起作用

您尝试的操作通常称为“动态/异步ES6模块加载”。不要太深陷其中。。但是当前的

import blah from X

只支持静态导入。如果你更关心这件事的细节。。有一个

同时。。。我们这些凡人必须依赖这样的工具，它们会完全满足你的要求

---

但就像“神圣”提到的。。。您需要某种类型的生成过程来生成独立的Vue组件。您可以使用WebPack或RollUp将其导出为UMD，并使用SystemJS通过引用完整URL导入该组件（您甚至可以从其他域导入该组件！假设该域支持CORS）

不应

http:sample domain.com

be

http://sample-domain.com

？@asastard是的，你是对的。我在上面的问题中解决了这个问题。THXI如果要异步导入组件，可以在vue路由器中使用延迟加载功能。在你的问题中，你提到好像你需要使用不同的URL访问。在这种情况下，您需要有两个单独的vuejs构建文件才能完成此任务。Maurice，webpack现在支持导入（）您可以更新您的答案吗？@ydennis-很好。我将在本周的某个时间进行测试，以确保新的webpack

import（）

函数跨域工作。