使用可选的 SFC 自定义 VueJS 应用程序

问题描述

我正在开发一个 VueJS 2 应用程序，该应用程序将核心功能作为一组组件（例如，用于 GUI 或结果显示部分的弹出框）作为占位符提供。

此应用程序旨在通过自定义这些占位符来扩展，以满足项目的特定需求。当前设想的方法是在包含基础应用程序及其衍生产品的 Git 项目的专用分支中，将自定义组件作为具有预定义名称（例如 custom-xxx.vue）的附加 SFC 提供，以便不会触及基础应用程序源当基础使用简单的 git merge 发展时，它允许在自定义版本中更新它们。这对于纯 JS 源的扩展已经很有效。

我已经尝试在组件部分导入带有类似内容的 custom-xxx SFC：

components: {
  . . .
  CustomPopup: () => {
    try {
      return require("./CustomPopup").default;
    } catch (e) {
      // fall back to the empty base component provided by the base application
      return require("./CustomPopupBase").default;
    }
  },. . . 
}

vue 模板在某处包含此内容：

  . . .
  <custom-popup></custom-popup>
  . . .

它不会产生任何错误，无论是在打包时（在我的情况下使用包裹）还是在页面加载时。回退机制工作正常（检查控制台消息）。但是，无论是否存在 CustomPopup SFC 文件，渲染页面中的任何地方都没有出现“自定义弹出”组件（使用 Chrome 上的 Vue 开发工具进行检查）。

这可能不是实现所追求目标的正确方法，如果您有任何建议，我将不胜感激。我不认为自己是 VueJS 专家，但我已经使用它几个月了，并且已经生成了更多“标准”应用程序。

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

javascript sfc vue.js