Angular 2 ES6 和 Promises 在 Internet Explorer 11 上不工作
Angular 2 with ES6 and Promises not working on Internet Explorer 11
我有一个 Angular 2 应用程序 运行 在 Chrome / Edge 上运行良好,但它在 Internet Explorer 上失败并出现以下错误。
我正在使用以下 index.html:
<!DOCTYPE html>
<html>
<head>
<base href="/">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>My App</title>
<link rel="stylesheet" href="css/font-awesome.min.css">
<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" href="css/lightbox.css">
<link rel="stylesheet" href="css/site.css">
<script src="scripts/es6-shim/es6-shim.min.js"></script>
<script src="scripts/systemjs/system-polyfills.js"></script>
<script src="scripts/angular2/shims_for_IE.js"></script>
<script src="scripts/jquery/jquery.min.js"></script>
<script src="scripts/bootstrap/bootstrap.min.js"></script>
<script src="scripts/systemjs/system.js"></script>
<script src="scripts/angular2/angular2-polyfills.min.js"></script>
<script src="scripts/angular2/angular2.min.js"></script>
<script src="scripts/angular2/http.min.js"></script>
<script src="scripts/angular2/router.min.js"></script>
<script src="scripts/angular2/Rx.min.js"></script>
<script src="scripts/moment/moment-with-locales.min.js"></script>
<script src="scripts/lightbox/lightbox.js"></script>
<script src="scripts/html5sql/html5sql.min.js"></script>
<script>
System.config({
packages: { 'app': { defaultExtension: 'js' } }
});
System.import('app/app/app.component');
</script>
</head>
<body>
<app></app>
</body>
</html>
据我所知,前 3 个 shims/polyfills 应该修复 IE 的任何缺失功能。我不确定是不是 Internet Explorer 缺少对 Promises、ES6 或其他东西的原生支持。我尝试将所有 Promises 交换为 Observables,但错误仍然存在。
对于任何感兴趣的人,解决方案主要是将我的 TypeScript 输出更改为 ES5 而不是 ES6。即使我使用了各种 ES6 填充程序,这仍然不足以让 Internet Explorer 工作。
更新:
将 TypeScript 编译器输出更改为 ES5 已在 tsconfig.json
文件中完成:
{
"compilerOptions": {
"target": "es5"
}
}
我有一个 Angular 2 应用程序 运行 在 Chrome / Edge 上运行良好,但它在 Internet Explorer 上失败并出现以下错误。
我正在使用以下 index.html:
<!DOCTYPE html>
<html>
<head>
<base href="/">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>My App</title>
<link rel="stylesheet" href="css/font-awesome.min.css">
<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" href="css/lightbox.css">
<link rel="stylesheet" href="css/site.css">
<script src="scripts/es6-shim/es6-shim.min.js"></script>
<script src="scripts/systemjs/system-polyfills.js"></script>
<script src="scripts/angular2/shims_for_IE.js"></script>
<script src="scripts/jquery/jquery.min.js"></script>
<script src="scripts/bootstrap/bootstrap.min.js"></script>
<script src="scripts/systemjs/system.js"></script>
<script src="scripts/angular2/angular2-polyfills.min.js"></script>
<script src="scripts/angular2/angular2.min.js"></script>
<script src="scripts/angular2/http.min.js"></script>
<script src="scripts/angular2/router.min.js"></script>
<script src="scripts/angular2/Rx.min.js"></script>
<script src="scripts/moment/moment-with-locales.min.js"></script>
<script src="scripts/lightbox/lightbox.js"></script>
<script src="scripts/html5sql/html5sql.min.js"></script>
<script>
System.config({
packages: { 'app': { defaultExtension: 'js' } }
});
System.import('app/app/app.component');
</script>
</head>
<body>
<app></app>
</body>
</html>
据我所知,前 3 个 shims/polyfills 应该修复 IE 的任何缺失功能。我不确定是不是 Internet Explorer 缺少对 Promises、ES6 或其他东西的原生支持。我尝试将所有 Promises 交换为 Observables,但错误仍然存在。
对于任何感兴趣的人,解决方案主要是将我的 TypeScript 输出更改为 ES5 而不是 ES6。即使我使用了各种 ES6 填充程序,这仍然不足以让 Internet Explorer 工作。
更新:
将 TypeScript 编译器输出更改为 ES5 已在 tsconfig.json
文件中完成:
{
"compilerOptions": {
"target": "es5"
}
}