SCRIPT1002: синтаксическая ошибка - IE11 и Angular

Question

Я получаю следующую ошибку при открытии проекта Angular из IE11:

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

Строка (224520), вызывающая ошибку, выглядит следующим образом:

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

Итак, вопрос ясен. Машинопись полностью не переведена. Теперь я застрял, потому что не знаю, как это исправить.

Файл, содержащий непереносимый вывод, расположен в ./node_modules/@progress/kendo-angular-layout/dist/es2015/tabstrip/tabstrip-events.js.

Итак, я чувствую, что мне нужно чтобы каким-то образом либо использовать другую версию файла (если она где-то присутствует), либо получить Angular для транспиляции файла, либо сделать что-то совершенно другое.

Не могли бы вы, пожалуйста, помочь мне запустить мое приложение в IE11, предложив шаги, которые я мог бы предпринять, чтобы исправить описанную выше проблему?

Кроме того, я только что проверил, что Chrome имеет тот же код (я имею в виду class... в строке 224520 из vendor.js). И он отлично работает. Я считаю, что это потому, что Chrome поддерживает ключевое слово class.

Answer 1

У меня возникает аналогичная проблема, когда я напрямую использовал 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.

Answer 2

Классы JavaScript не поддерживаются браузером IE, вы можете проверить совместимость JavaScript классов с браузером .

В приложении angular, если мы хотим определить класс, мы могли бы создать класс модели с помощью машинописного текста.

Например, создайте класс Hero в папке src / app с именем hero.ts.

Код в src / app / hero.ts

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

Затем в классе компонента мы могли бы импортировать класс Hero и использовать класс Hero, используя следующий код:

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, пожалуйста, проверьте полифилл .ts файл, убедитесь, что вы раскомментировали соответствующие полифиллы для браузера IE, например:

/** 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.