Angular2 RC1应用程序无法在IE 11

时间:2016-06-22 13:13:55

标签: angular internet-explorer-11

我在Angular 2中创建了应用程序,现在我正在使用RC1。我希望使用core.js 2.4.0(没有IE的垫片)将是Internet Explorer的一切。但该应用程序仍在加载......

以下是来自IE 11的控制台日志:

SCRIPT1010: Expected identifier
File: zone.js, Line: 648, Column: 37
SCRIPT1010: Expected identifier
File: Reflect.js, Line: 518, Column: 26
SCRIPT5022: Exception thrown and not caught
File: shim.min.js, Line: 7, Column: 6147

有必要说,在localhost上的IE中一切正常,但在服务器上却没有。我想,localhost的地址是http://localhost:8080/,但是在服务器上(使用反向代理)是https://something.cz.something.com/zds/

我的index.html是:

<html>

<head>
    <!-- build:baseUrl -->
    <base href="/">
    <!-- endbuild -->

    <title></title>

    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">


    <!-- 1. Load libraries -->
    <!-- Polyfill(s) for older browsers -->
    <script src="node_modules/core-js/client/shim.min.js"></script>

    <script src="node_modules/zone.js/dist/zone.js"></script>
    <script src="node_modules/reflect-metadata/Reflect.js"></script>
    <script src="node_modules/systemjs/dist/system.src.js"></script>

    <link href="app/css/jquery-ui.css" rel="stylesheet">
    <link href="app/css/bootstrap.min.css" rel="stylesheet">
    <link href="app/css/font-awesome.min.css" rel="stylesheet">
    <link href="app/css/style.css" rel="stylesheet">
    <link href="app/css/bootstrap.login.css" rel="stylesheet">

    <!-- datetimepicker calendar-->
    <link rel="stylesheet" href="node_modules/eonasdan-bootstrap-datetimepicker/build/css/bootstrap-datetimepicker.min.css" />

    <script type="text/javascript" src="node_modules/jquery/dist/jquery.min.js"></script>
    <script type="text/javascript" src="node_modules/moment/min/moment.min.js"></script>
    <script type="text/javascript" src="node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
    <script type="text/javascript" src="node_modules/eonasdan-bootstrap-datetimepicker/build/js/bootstrap-datetimepicker.min.js"></script>
    <!--end datetimepicker calendar-->

    <!-- build:bundlejs -->
    <!-- endbuild -->


    <!-- build:systemjs -->
    <script src='systemjs.config.js'></script><script>System.import('app').catch(function(err){ console.error(err); });</script>
    <!-- endbuild -->
</head>

<!-- 3. Display the application -->

<body>
    <zds>Loading...</zds>
</body>

</html>

Package.json是:

{
  "name": "zds-demo",
  "version": "1.0.0",
  "private": true,
  "scripts": {
    "gulp": "gulp",
    "tsc": "tsc",
    "tsc:w": "tsc -w",
    "typings": "typings",
    "postinstall": "typings install"
  },
  "license": "ISC",
  "dependencies": {
    "@angular/common":  "2.0.0-rc.1",
    "@angular/compiler":  "2.0.0-rc.1",
    "@angular/core":  "2.0.0-rc.1",
    "@angular/http":  "2.0.0-rc.1",
    "@angular/platform-browser":  "2.0.0-rc.1",
    "@angular/platform-browser-dynamic":  "2.0.0-rc.1",
    "@angular/router":  "2.0.0-rc.1",
    "@angular/router-deprecated":  "2.0.0-rc.1",
    "@angular/upgrade":  "2.0.0-rc.1",

    "systemjs": "^0.19.27",
    "core-js": "^2.4.0",
    "reflect-metadata": "^0.1.3",
    "rxjs": "5.0.0-beta.6",
    "zone.js": "^0.6.12",

    "angular2-in-memory-web-api": "0.0.11",
    "bootstrap": "^3.3.6",    

    "moment": "~2.8",
    "jquery": ">=1.8.3 <2.2.0",
    "eonasdan-bootstrap-datetimepicker": "4.15.35",
    "express-history-api-fallback": "latest",
    "express": "latest"    
  },
  "devDependencies": {
    "browser-sync": "^2.12.5",
    "concurrently": "^2.0.0",
    "del": "1.1.1",
    "gulp": "latest",
    "gulp-compass": "latest",
    "gulp-copy": "latest",
    "gulp-html-replace": "^1.5.5",
    "gulp-rename": "latest",
    "gulp-sourcemaps": "^1.6.0",
    "gulp-typescript": "latest",
    "path": "latest",
    "run-sequence": "1.1.0",
    "typescript": "^1.8.10",
    "systemjs-builder": "^0.15.23",
    "typings": "^1.0.4"
  }
}

系统配置为:

    var map = {
    'app':                        'app', // 'dist',
    '@angular':                   'node_modules/@angular',
    'angular2-in-memory-web-api': 'node_modules/angular2-in-memory-web-api',
    'rxjs':                       'node_modules/rxjs'
  };
  // packages tells the System loader how to load when no filename and/or no extension
  var packages = {
    'app':                        { main: 'ts/main.component.js',  defaultExtension: 'js' },
    'rxjs':                       { defaultExtension: 'js' },
    'angular2-in-memory-web-api': { main: 'index.js', defaultExtension: 'js' },
  };
  var ngPackageNames = [ // <-----
    'common',
    'compiler',
    'core',
    'http',
    'platform-browser',
    'platform-browser-dynamic',
    'router',
    'router-deprecated',
    'upgrade',
  ];
  // Individual files (~300 requests):
  function packIndex(pkgName) {
    packages['@angular/'+pkgName] = { main: 'index.js', defaultExtension: 'js' };
  }
  // Bundled (~40 requests):
  function packUmd(pkgName) {
    packages['@angular/'+pkgName] = { main: pkgName + '.umd.js', defaultExtension: 'js' };
  };
  // Most environments should use UMD; some (Karma) need the individual index files
  var setPackageConfig = System.packageWithIndex ? packIndex : packUmd;
  // Add package entries for angular packages
  ngPackageNames.forEach(setPackageConfig);
  var config = {
    map: map,
    packages: packages
  }
  System.config(config);

谢谢。

0 个答案:

没有答案