Vue.js SFC 在编译时有条件地包含模板元素答案

【问题标题】：Vue.js SFC conditionally include template elements at compile timeVue.js SFC 在编译时有条件地包含模板元素
【发布时间】：2020-03-18 19:41:31
【问题描述】：

我们的产品有多个客户，每个客户都有自己的客户特定修改。

在 SFC 的 Vue2 模板中是否有办法在构建时根据构建环境变量有条件地包含或排除其他组件？

看起来我可以使用 webpack-conditional-loader 之类的东西在构建时有条件地包含/排除 JavaScript 代码，但是模板代码是否有等价物？

例如。像这样：

<template>
  <##if process.env === 'CustomerA'>
    <customer-a-dialog></customer-a-dialog>
  </##if>
  <##if process.env === 'CustomerB'>
    <customer-b-dialog></customer-b-dialog>
  </##if>
</template>

谢谢，扳手

【问题讨论】：

你找到答案了吗？

标签： vue.js webpack vue-component vue-cli-3

【解决方案1】：

您可以使用以下库，它可以允许对 html/vue 模板代码进行条件预处理：

js-conditional-compile-loader

希望对你有帮助！

【讨论】：