SCRIPT1002：语法错误 - IE11 和 Angular

Question

从 IE11 打开 Angular 项目时出现以下错误：

SCRIPT1002: Syntax error
vendor.js (224520,1)

产生错误的行 ( 224520 ) 如下所示：

class PreventableEvent {
    constructor() {
        this.prevented = false;
    }
...

所以，这个问题很清楚。 typescript 尚未完全转译。 现在我被卡住了，因为我不知道如何解决它。

包含未转译的 output 的文件位于./node_modules/@progress/kendo-angular-layout/dist/es2015/tabstrip/tabstrip-events.js 。

所以，我觉得我需要以某种方式使用不同版本的文件（如果存在于某处）或让 Angular 转译文件或做一些完全不同的事情。

您能否通过建议我可以采取的解决上述问题的步骤来帮助我使我的应用程序在 IE11 中运行？

另外，我刚刚检查了 Chrome 是否有相同的代码（我的意思是class...的224520行中的vendor.js ...）。 它工作得很好。 我相信这是因为 Chrome 支持class关键字。

Answer 1

JavaScript 类不支持 IE 浏览器，您可以检查JavaScript 类浏览器兼容性。

In the angular application, if we want to define a class, we could create a model class using typescript.

例如，在 src/app 文件夹中创建一个 Hero class，命名为 hero.ts。

src/app/hero.ts 中的代码

export class Hero {
  id: number;
  name: string;
}

然后在组件 class 中，我们可以导入 Hero class，并使用以下代码使用 Hero class：

import { Component, OnInit } from '@angular/core';
import { Hero } from '../hero';

@Component({
  selector: 'app-heroes',
  templateUrl: './heroes.component.html',
  styleUrls: ['./heroes.component.css']
})
export class HeroesComponent implements OnInit {
  hero: Hero = {
    id: 1,
    name: 'Windstorm'
  };

  constructor() { }

  ngOnInit() {
  }

}

有关 angular 应用的更多详细信息，请查看angular 文档。

另外，对于 Angular 应用，如果 Angular 版本低于或等于 Angular 7，请检查 polyfill.ts 文件，确保取消注释相关的 IE 浏览器 polyfill：

/** IE9, IE10 and IE11 requires all of the following polyfills. **/
import 'core-js/es6/symbol';
import 'core-js/es6/object';
import 'core-js/es6/function';
import 'core-js/es6/parse-int';
import 'core-js/es6/parse-float';
import 'core-js/es6/number';
import 'core-js/es6/math';
import 'core-js/es6/string';
import 'core-js/es6/date';
import 'core-js/es6/array';
import 'core-js/es6/regexp';
import 'core-js/es6/map';
import 'core-js/es6/weak-map';
import 'core-js/es6/set';

如果您使用的是 angular 8+，请查看此链接以将应用程序配置为运行 es5 模式。

Answer 2

当我从以下位置直接使用 SelectedEvent 时，我遇到了类似的问题：

import { SelectEvent } from '@progress/kendo-angular-layout/dist/**es2015**/tabstrip/tabstrip-events';

IE 11 不支持 es2015 搞错了

我应该使用来自不同路径的对象：

from '@progress/kendo-angular-layout/dist/**es**/tabstrip/tabstrip-events';

或使 angular 自动选择您应该选择的版本。

from '@progress/kendo-angular-layout/';

请检查您是否使用了正确的 es 版本。