如何解决如何在 Snowpack 3 中使用模板 HTML?
我是 SNowpack 的新手,我在目标输出文件夹中有一个 Template.html' file in my source folder that I would like SNowpack to read and produce an
index.html`。如果我可以在模板中使用一些变量,SNowpack 可以简单地从环境或配置文件中替换这些变量,那也很好。知道如何实现这一目标吗?
解决方法
如果我理解正确,您希望使用 index.html
的替代方法。我不确定您使用的是 React 还是其他框架,但如果您使用的是 React,我找到了一个解决方案。
此上下文仅供参考,与问题无关,但如果对其他人有帮助,我会分享。就我而言,我想在我的生产版本中阻止以下警告(由于反应脚本,而不是雪堆):
从“http://localhost:3000/dist/index.js”加载模块由于不允许的 MIME 类型(“text/html”)而被阻止。
这是因为 snowpack 需要在 index.html
中使用以下脚本标记来生成您的页面:
...
<script type="module" src="/dist/index.js"></script>
...
我现在不需要在生产中使用雪堆---我现在只是为了模块热重载而在这里---所以我想用一个替代的 index.html
文件来抑制这个警告,只是用于snowpack,以便它具有此脚本标记。
解决方案:
因此,对于您想在 snowpack 中使用变量的情况 --- 但不是您的生产构建(或其他运行脚本)--- 您可以执行以下操作:
-
在您的
index.html
正文中使用上述脚本创建一个模板,以及您需要的任何其他变量。将其命名为“index.html”以外的其他名称。为简单起见,我选择了indexsnowpack.html
。 -
将以下路由 (Docs here) 添加到应用根目录中的
snowpack.config.js
文件:
module.exports = {
...
routes: [
{
match: "routes",src: ".*",dest: "/indexsnowpack.html"
}
]
...
}
注意:上述解决方案将匹配您的新 indexsnowpack.html
文件的所有路径。因此,如果您不使用单页应用程序设置,您会遇到一些问题。此外,如果您定义了其他路由(例如,用于 api 调用),请将它们放在此路由之上,以便此路由作为除 api 之外的所有调用的后备。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。