我使用 Vue CLI 制作了一个简单的 Vue 应用程序,现在我想在 html 的头部有条件地添加 Google 跟踪代码管理器代码,仅用于生产构建。我可以使用像 php 这样的服务器端语言来做到这一点,所以我尝试将index.html更改为index.php,但是当我构建项目时,它输出一个带有注入(inject)应用程序的index.html和一个没有注入(inject)应用程序的index.php dist 文件夹。 php 代码也不适用于 vue cli 中的 webpack-dev-server。
如何将一些服务器端代码(不一定是 php)集成到 vue cli 生成的 vue 应用程序的索引中,以便有条件地添加用于生产构建的标签管理器代码?我不确定 vue cli 构建过程是如何完成的。我可以告诉它在生产版本中使用不同的 index.html 吗?
额外:我有兴趣了解有关 vue cli 构建过程的更多信息。前任。模板index.html中没有script标签,那么在构建或使用webpack-dev-server时,Vue如何将自身注入(inject)到索引中?
最佳答案
我刚刚在vue cli documentation中看到index.html 页面是由 webpack 处理的。这意味着我可以使用 lodash 模板语法轻松地仅在生产时在头部添加标签
<head>
...
<%= process.env.NODE_ENV === 'production' ? '<script>...</script>' : '' %>
...
</head>
关于webpack - 如何在Vue应用程序的头部有条件地添加代码,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52400209/