Angular/Cordova：android设备上的MIME类型问题

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来修复此问题/

<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>

如果我将其更改为，应用程序将在我的设备上正确运行。

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

Answer 1

可以通过在编译前定义一个运行shell脚本的钩子来修复资产：

sed -i 's/original/new/g' ./platforms/android/assets/index.html

这些正则表达式可能应该与原始的nomodule和type=“module”匹配。

Answer 2

您可以更新您的tsconfig。angular项目中的json：

"target": "es5",

如果不想更改tsconfig中的目标，可以使用before\u prepare hook file替换索引中的内容。html

在文件夹挂钩中添加新文件夹并将其命名为“before\u prepare”。。。在before\u prepare文件夹中添加新的js文件并将其命名为“01\u switch\u 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);
        }
    });
}