Vue CLI 3 将 eval 函数添加到自定义模板标签答案

【问题标题】：Vue CLI 3 Prepending eval Function to Custom Template TagsVue CLI 3 将 eval 函数添加到自定义模板标签
【发布时间】：2019-02-14 10:51:29
【问题描述】：

我正在运行一个 webpack-dev 服务器来开发一个 Vue 应用程序（Vue CLI 3）。我们公司使用类似于 ASP.NET 的自定义模板语言（函数以后缀结尾，并且它们在服务器端进行评估），这似乎导致 webpack-dev 服务器出现问题。在下面的示例中，我尝试将specs 变量设置为<%json_item_specifications%>：

  export default {
  name: 'HelloWorld',
  props: {
    msg: String
  },
  data() {
    return {
      specs: <%json_item_specifications%>,
    }
  }
}

在上面的示例中，webpack 将使用 eval 函数转义 json 函数，并将其作为导出的一部分返回：

eval("__webpack_require__.r(__webpack_exports__ ...

前导 eval 导致页面中断，我不确定 webpack 堆栈的哪一部分导致了这种情况。我正在使用 vue-cli 3 附带的打包 webpack，我知道它在后台使用 Babel。

我相信来自 webpack 的 Babel 正在将

感谢您的任何帮助！

【问题讨论】：

标签： vue.js webpack webpack-dev-server vue-cli-3

【解决方案1】：

我对您的问题有两个想法：

您应该尝试使用 X 模板（而不是单个文件组件）或带有独立版本 Vue 的内联模板。你可以阅读更多关于这里的信息： https://sebastiandedeyne.com/dealing-with-templates-in-vue-20
另一个可能的解决方案是规范的本地化。我只有使用 Wordpress(PHP) 的经验，但是您可以通过 PHP 创建一个 Javascript 对象以进行设置，稍后您可以在模板中阅读这些设置。

【讨论】：