Angular2 RC6未捕获ReferenceError：未定义系统

Question

I am upgrading my rc5 project to rc6. 我正在将rc5项目升级到rc6。 I have updated the rest of the code, now it compiles, but when I navigate to the project in browser, I am receiving errors. 我已经更新了其余代码，现在可以编译了，但是当我在浏览器中导航到项目时，我收到了错误。 I think the issue is in my systemjs config file, ie in System.config 我认为问题出在我的systemjs配置文件中，即System.config中

My index.html is: 我的index.html是：

<!DOCTYPE html>
<html lang="en">

<head>
  <base href="/">
  <title>Angular2 rc6</title>
  <meta name="viewport" content="width=device-width, initial-scale=1">

  <link rel="stylesheet" href="css/vendor.css" />

  <script src="node_modules/typescript/lib/typescript.js"></script>
  <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/systemjs/dist/system.src.js"></script>

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

<body>
  <app>Loading...</app>
</body>

</html>

systemjs.config.js systemjs.config.js

System.config({
    transpiler: 'typescript',
    typescriptOptions: {emitDecoratorMetadata: true},
    map: {
      '@angular': 'node_modules/@angular',
      'rxjs'    : 'node_modules/rxjs'
    },
    paths: {
      'node_modules/@angular/*': 'node_modules/@angular/*/bundles'
    },
    meta: {
      '@angular/*': {'format': 'cjs'}
    },
    packages: {
      'app'                              : {main: 'main', defaultExtension: 'js'},
      'rxjs'                             : {main: 'Rx'},
      '@angular/core'                    : {main: 'core.umd.min.js'},
      '@angular/common'                  : {main: 'common.umd.min.js'},
      '@angular/compiler'                : {main: 'compiler.umd.min.js'},
      '@angular/platform-browser'        : {main: 'platform-browser.umd.min.js'},
      '@angular/platform-browser-dynamic': {main: 'platform-browser-dynamic.umd.min.js'}
    }
});

The project structure is 项目结构是

project
|-systemjs.config.js
|-src
    |-index.html
    |-app
       |-main.ts
          |-...

Errors 失误

typescript.js:1 Uncaught SyntaxError: Unexpected token <
shim.min.js:1 Uncaught SyntaxError: Unexpected token <
zone.js:1 Uncaught SyntaxError: Unexpected token <
system.src.js:1 Uncaught SyntaxError: Unexpected token <
systemjs.config.js:1 Uncaught SyntaxError: Unexpected token <
(index):20 Uncaught ReferenceError: System is not defined

Answer 1

I believe its because you need to update your Systemjs.config.js file. 我相信这是因为您需要更新Systemjs.config.js文件。 Rc.6 made some significant changes to the config file. Rc.6对配置文件进行了一些重大更改。 I solved this error on my own project by copying in the new systemjs.config.js file, making sure if you added special mapping or paths for your project that you add it to the 通过复制新的systemjs.config.js文件，并确保是否为项目添加了特殊的映射或路径，我将其添加到自己的项目中，从而解决了该错误。

map:{}

and 和

paths:{}

section on the config. 配置部分。 Also just as a good practice, I would move index.html out to the root of your project (next with you systemjs.config.js), and because your app folder is nested with a src folder, you may need to add it to your map in the systemjs.config for example 同样作为一种好习惯，我将index.html移到项目的根目录（接下来是systemjs.config.js），并且由于您的应用程序文件夹嵌套了src文件夹，因此您可能需要将其添加到例如，您在systemjs.config中的地图

map{
    app: 'src/app'
}

also you can find the new systemjs.config.js here angular.io 您也可以在这里找到新的systemjs.config.js angular.io

Angular2 RC6未捕获ReferenceError：未定义系统

问题描述

1 个解决方案

解决方案1
0 2016-09-02 14:25:17

Angular2 RC6未捕获ReferenceError：未定义系统

问题描述

1 个解决方案

解决方案1 0 2016-09-02 14:25:17

解决方案1
0 2016-09-02 14:25:17