使用带有基本href参数的npm运行构建的角度部署不会呈现页面

Question

最近我遇到了一个问题，我们使用了；npm运行构建"；命令。然后是参数，如"base href"、"configuration"等。构建完成，部署成功，但当我们测试应用程序时，它不会呈现页面，但控制台将出现以下或类似错误。

Failed to load module script: The server responded with a non-JavaScript MIME type of "text/html". Strict MIME type checking is enforced for module scripts per HTML spec.
runtime-es2015.js:1
Failed to load module script: The server responded with a non-JavaScript MIME type of "text/html". Strict MIME type checking is enforced for module scripts per HTML spec.
polyfills-es2015.js:1 
Failed to load module script: The server responded with a non-JavaScript MIME type of "text/html". Strict MIME type checking is enforced for module scripts per HTML spec.
vendor-es2015.js:1 
Failed to load module script: The server responded with a non-JavaScript MIME type of "text/html". Strict MIME type checking is enforced for module scripts per HTML spec.
main-es2015.js:1

我们在yaml中使用的命令是

npm run build -- "-c=<environment> --base-href='/Domain-href-url/'"

SO中建议的类似问题并没有解决或帮助，因为脚本过去在本地工作，使用package.json cmds运行良好，在Azure管道中使用angular的vNext构建管道运行良好(如果没有传递参数(。但是我们需要环境参数和基本href。

Answer 1

我在这里发布这个问题，因为它可能对那些在yaml脚本中也有/面临这个问题的人有所帮助。

我找不到任何更好的解决方案帮助来源，但最终我找到了一个有帮助的链接。

除此之外，由于我们传递的基本href的参数值，问题仍然存在。如果我们在参数中传递--base href='/Domain href-url/'(如单引号或双引号(，它将创建带有的index.html

<base href="'/Domain-href-url/'">

查看带有单引号的href url。。这就造成了这个麻烦。

因此，解决方案是：(相当简单：-((传递不带引号的参数。

npm运行构建----基本href=/Domain href=url/

<base href="/Domain-href-url/">

相信我，当通过yaml脚本和构建管道将这些构建参数作为参数传递时，这将解决这些问题。

现在，如果我们遵循相同的脚本命令，使用package.json中的脚本为其他人提供的替代解决方案也会起作用。

如我的用例示例：

"build-qa": "ng build -c=test --base-href=/Domain-href-url/",

希望这能帮助那些在构建节点或角度应用程序的构建管道yaml脚本中面临此类问题的人。