webpack - Vue.js Webpack 模板头标签
问题描述
https://github.com/vuejs-templates/webpack/
使用 vue cli - 生成 html 文件...不断获取我的模板中不存在的 head 标签。
更多详情：
我有一个现有的应用程序 - 用 hapi.js 编写。它提供呈现的 html 页面。Nunjunks 用于模板。
我有一个必须位于 Nunjunks 呈现的 html 中的 Vue SPA / 小部件（使用 view cli 和 vue webpack 构建）。
在我的 nunjunks 模板中，我有一个部分{% include 'vueapps/paintpicker.html' %}
我已设置config/index.js将文件输出paintpicker.html到 vueapps 目录中。
我的 index.html 文件（从中生成paintpicker.html）如下所示：
{% extends 'layout/web-layout.html' %}
{% block main %}
<div id="app"></div>
{% endblock %}
但是...一旦构建，我的paintpicker.html 文件看起来像这样（我添加了新行以使其更易于阅读）。
<head>
<link href=/static/css/app.1de2d621551be454289c9d7cf89d0ded.css rel=stylesheet>
</head>
{% extends 'layout/web-layout.html' %}
{% block main %}
<div id=app></div>
{% endblock %}
<script type=text/javascript src=/static/js/manifest.2ae2e69a05c33dfc65f8.js></script><script type=text/javascript src=/static/js/vendor.158e5ebf7c414a428726.js></script>
<script type=text/javascript src=/static/js/app.99b16fc5705b655dd61b.js></script>
我收到了一个<head>标签-我不知道如何摆脱它...
解决方案
所以......在引擎盖下，正在使用 html-webpack。我进入 /build/webpack.prod.conf.js，并将注入设置为 false。
然后，从此模板中获取变量 -
我能够将它们插入到我的模板中。结果现在按要求呈现。
https://github.com/jantimon/html-webpack-plugin
有关信息，请参阅 webpack.config.js 部分。