如何在Webpack打包的项目html中根据环境动态加载脚本？

Question

例如我想在index.html中根据环境动态加载谷歌分析。开发环境不引入它的script，生产环境引入它的script。我试过通过读取process.env属性，但是不同于项目内的js文件，在index.html中读取不到。有什么解决方案吗？

Answer 1

有html-webpack-plugin的话，加个判断就好了。

<%=process.env.NODE_ENV==='production' ? '<script src="xxx.js"></script>' : ''%>

Answer 2

简单点的做法，你可以在不同环境用不一样的index.html就好了，这个总是容易做到的。