Internet Explorer 10에서 Angular 4/5가 작동하는 방법

Internet Explorer 10에서 매우 간단한 응용 프로그램을 실행하려고합니다. 'new projectname'을 실행할 때 표시되는 응용 프로그램에 대해 이야기하고 있습니다. polyfill.js 파일에있는 파일의 주석 처리를 제거했습니다.Internet Explorer 10에서 Angular 4/5가 작동하는 방법

"compilerOptions": { 
    "outDir": "./dist/out-tsc", 
    "sourceMap": true, 
    "declaration": false, 
    "moduleResolution": "node", 
    "emitDecoratorMetadata": true, 
    "experimentalDecorators": true, 
    "target": "es5", 
    "typeRoots": [ 
     "node_modules/@types" 
    ], 
    "lib": [ 
     "es2017", 
     "dom" 
    ] 
    } 
}

내 index.html 파일 :

{ 
    "name": "bogstandard", 
    "version": "0.0.0", 
    "license": "MIT", 
    "scripts": { 
    "ng": "ng", 
    "start": "ng serve", 
    "build": "ng build", 
    "test": "ng test", 
    "lint": "ng lint", 
    "e2e": "ng e2e" 
    }, 
    "private": true, 
    "dependencies": { 
    "@angular/animations": "^5.0.0", 
    "@angular/common": "^5.0.0", 
    "@angular/compiler": "^5.0.0", 
    "@angular/core": "^5.0.0", 
    "@angular/forms": "^5.0.0", 
    "@angular/http": "^5.0.0", 
    "@angular/platform-browser": "^5.0.0", 
    "@angular/platform-browser-dynamic": "^5.0.0", 
    "@angular/router": "^5.0.0", 
    "classlist.js": "^1.1.20150312", 
    "core-js": "^2.4.1", 
    "rxjs": "^5.5.2", 
    "web-animations-js": "^2.3.1", 
    "zone.js": "^0.8.14" 
    }, 
    "devDependencies": { 
    "@angular/cli": "1.5.0", 
    "@angular/compiler-cli": "^5.0.0", 
    "@angular/language-service": "^5.0.0", 
    "@types/jasmine": "~2.5.53", 
    "@types/jasminewd2": "~2.0.2", 
    "@types/node": "~6.0.60", 
    "codelyzer": "~3.2.0", 
    "jasmine-core": "~2.6.2", 
    "jasmine-spec-reporter": "~4.1.0", 
    "karma": "~1.7.0", 
    "karma-chrome-launcher": "~2.1.1", 
    "karma-cli": "~1.0.1", 
    "karma-coverage-istanbul-reporter": "^1.2.1", 
    "karma-jasmine": "~1.1.0", 
    "karma-jasmine-html-reporter": "^0.2.2", 
    "protractor": "~5.1.2", 
    "ts-node": "~3.2.0", 
    "tslint": "~5.7.0", 
    "typescript": "~2.4.2" 
    } 
}

내 tsconfig.json 파일입니다 : 내가 여기에 64 비트

Windows 7에서 작업하고 나의 package.json입니다

<!doctype html> 
<html lang="en"> 
<head> 
    <meta charset="utf-8"> 
    <meta http-equiv="X-UA-Compatible" content="ie=edge"> 
    <title>Bogstandard</title> 
    <base href="/"> 

    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <link rel="icon" type="image/x-icon" href="favicon.ico"> 
</head> 
<body> 
    <app-root></app-root> 
</body> 
</html>

마지막으로 여기 polyfill.js 파일이 있습니다 (애니메이션이나 SVG를 사용하지 않습니다) :

/** 
* This file includes polyfills needed by Angular and is loaded before the app. 
* You can add your own extra polyfills to this file. 
* 
* This file is divided into 2 sections: 
* 1. Browser polyfills. These are applied before loading ZoneJS and are sorted by browsers. 
* 2. Application imports. Files imported after ZoneJS that should be loaded before your main 
*  file. 
* 
* The current setup is for so-called "evergreen" browsers; the last versions of browsers that 
* automatically update themselves. This includes Safari >= 10, Chrome >= 55 (including Opera), 
* Edge >= 13 on the desktop, and iOS 10 and Chrome on mobile. 
* 
* Learn more in https://angular.io/docs/ts/latest/guide/browser-support.html 
*/ 

/*************************************************************************************************** 
* BROWSER POLYFILLS 
*/ 

/** 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'; 

/** IE10 and IE11 requires the following for NgClass support on SVG elements */ 
import 'classlist.js'; // Run `npm install --save classlist.js`. 

/** IE10 and IE11 requires the following for the Reflect API. */ 
// import 'core-js/es6/reflect'; 


/** Evergreen browsers require these. **/ 
// Used for reflect-metadata in JIT. If you use AOT (and only Angular decorators), you can remove. 
import 'core-js/es7/reflect'; 


/** 
* Required to support Web Animations `@angular/platform-browser/animations`. 
* Needed for: All but Chrome, Firefox and Opera. http://caniuse.com/#feat=web-animation 
**/ 
import 'web-animations-js'; // Run `npm install --save web-animations-js`. 



/*************************************************************************************************** 
* Zone JS is required by Angular itself. 
*/ 
import 'zone.js/dist/zone'; // Included with Angular CLI. 



/*************************************************************************************************** 
* APPLICATION IMPORTS 
*/ 

/** 
* Date, currency, decimal and percent pipes. 
* Needed for: All but Chrome, Firefox, Edge, IE11 and Safari 10 
*/ 
// import 'intl'; // Run `npm install --save intl`. 
/** 
* Need to import at least one locale-data with intl. 
*/ 
// import 'intl/locale-data/jsonp/en';

Internet Explorer 11에서 실행되지만 그 아래의 항목은 오류가 발생합니다. 오류 메시지가 '구문 오류'이며 vendor.bundle.js를 가리 킵니다.

여기에 일부 이미지입니다

Error on Internet Explorer 10 Part 1

Error on Internet Explorer 10 Part 2

친절 감사

스티븐

출처

2017-11-26 Stephen Axtell

질문 자체에 오류를 제공해주십시오. 외부 웹 사이트에 대한 링크를 열지 마십시오. –

그것들은 내가 그들을 삽입 할 수 있도록 허용되지 않은 이미지들이므로 자동적으로 나에게이 링크들을 주었다. 이것은 그것을하지 Stackoverflow, 나하지. 오류 메시지가 '구문 오류'이며 vendor.bundle.js를 가리 킵니다. –