时间戳

首页 > 解决方案 > 使用带有 base-href 参数的 npm run build 的角度部署不会呈现页面

javascript - 使用带有 base-href 参数的 npm run build 的角度部署不会呈现页面

问题描述

最近我遇到了一个问题，我们在构建管道 yaml 脚本中使用了“npm run build”命令。然后是'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管道中使用vNext构建管道进行角度工作（如果没有传递参数）。但是我们需要环境参数和base-href。

标签： javascriptangularyamlpipelineazure-pipelines-yaml

解决方案

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

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

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

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

查看带有单引号的href url .. 这会导致这个麻烦。

所以解决方案是：（相当简单:-)）传递不带引号的参数。

npm run build -- --base-href=/Domain-href-url/

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

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

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

如我的用例示例：

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

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

推荐阅读