javascript - Angular/ Cordova : MIME Type issue on android device

Question

我创建了一个 Cordova 应用程序，它在创建新项目时仅提供默认的 Angular 欢迎页面。它在浏览器中运行良好。当通过 Android Studio 在模拟器上运行它时，它工作正常。

当我在我的 android 设备上运行它时，我得到一个空白页面，并且控制台中出现以下错误:

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

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

我可以通过 dist/<project>/index.html 编辑来解决这个问题由 Angular 创建。 Angular 不再包含 type="text/javascript" <script> 中的参数它创建的标签。相反，它们看起来像这样:

<script src="runtime-es2015.858f8dd898b75fe86926.js" type="module"></script>
<script src="polyfills-es2015.5728f680576ca47e99fe.js" type="module"></script>
<script src="runtime-es5.741402d1d47331ce975c.js" nomodule></script>
<script src="polyfills-es5.7f43b971448d2fb49202.js" nomodule></script>
<script src="main-es2015.734c1bff4ed0a6bbbd29.js" type="module"></script>
<script src="main-es5.43ecaae92d6e77bfb1c5.js" nomodule></script>

如果我将其更改为 type="text/javascript"该应用程序在我的设备上正常运行。

我如何告诉 Cordova 在提供 javascript 文件时包含正确的 MIME 类型 header ？

Answer 1

您可以在 Angular 项目中更新您的 tsconfig.json:

"target": "es5",

如果你不想在 tsconfig 中更改目标，你可以使用 before_prepare 钩子(Hook)文件来替换 index.html 中的内容

在文件夹 Hook 中添加新文件夹并将其命名为“before_prepare”...在 before_prepare 文件夹中添加新的 js 文件并将其命名为例如“01_switch_configuration.js”

#!/usr/bin/env node

var fs = require('fs');
var path = require('path');

var rootdir = process.argv[2];

function replace_string_in_file(filename, to_replace, replace_with) {
    var data = fs.readFileSync(filename, 'utf8');
    var result = data.replace(new RegExp(to_replace, "g"), replace_with);
    fs.writeFileSync(filename, result, 'utf8');
}
if (rootdir) {
    var filestoreplace = ["www/index.html"];
    filestoreplace.forEach(function(val, index, array) {
        var fullfilename = path.join(rootdir, val);
        if (fs.existsSync(fullfilename)) {
            replace_string_in_file(fullfilename, 'type="module"', 'type="text/javascript"');
        } else {
            console.log("missing: " + fullfilename);
        }
    });
}

并运行你的项目