如何添加javascript头到Node js构建index.html

Question

所以我试图使一个工作的React应用程序变成一个Twitch扩展(我不需要任何Twitch集成)。

唯一能让它与Twitch的iframes一起工作的是在html文件中添加一个标签

<script src="https://extension-files.twitch.tv/helper/v1/twitch-ext.min.js"></script>

启动时另一个javascript代码调用使用了twitch-ext。min。js文件

中的内容

window.Twitch.ext.onAuthorized(function(auth) {
console.log('The JWT that will be passed to the EBS is', auth.token);
console.log('The channel ID is', auth.channelId);
});

我现在做的是运行npm build然后手动编辑生成的index.html和main.xxxxx.js，将这些代码行包含在优化的最小化文件中。这显然看起来有点低效，我觉得必须有一种方法告诉节点，在构建过程中它应该包含这些行。我问的是可能的吗?

Answer 1

所以我从一个了解Node的人那里得到了答案。你要做的就是编辑react应用应该有的index.html和index.js文件。

npm run build 实际上使用这两个文件来生成缩小的构建文件所以我只添加了

<script src="https://extension-files.twitch.tv/helper/v1/twitch-ext.min.js"></script>

index.htmla我的

window.Twitch.ext.onAuthorized()

在index.js文件中调用，一切正常。

如果你使用npx create-react-app，你可以在react项目的公共文件夹中找到index.html。而index.js在src文件夹中。