没有findangular2 – 404 traceur
我已经遵循了起始指南，并扩展了以前的angular度2版本。 我已经更新了我的修订，并相应地改变了一切 当我运行Web服务器时，我现在收到traceur的错误404 … 
这是我的项目结构： 
相关文件：
index.html的：
<html> <head> <title>Kinepolis HR-tool</title> <base href="./"> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="description" content="Kinepolis HR tool"> <meta name="author" content="Jeffrey Devloo!"> <link rel="stylesheet" type="text/css" href="assets/css/bootstrap.min.css" /> <!-- CSS for PrimeUI --> <!-- 1. Load libraries --> <!-- Polyfill(s) for older browsers --> <script src="node_modules/es6-shim/es6-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> <!-- 2. Configure SystemJS --> <script src="systemjs.config.js"></script> <script> System.import('app').catch(function(err){ console.error(err); }); </script> </head> <!-- 3. Display the application --> <body> <my-app>Loading...</my-app> </body> </html> systemjs.config.js
(function(global) { // map tells the System loader where to look for things var map = { 'app': 'app', // 'dist', 'rxjs': 'node_modules/rxjs', 'angular2-in-memory-web-api': 'node_modules/angular2-in-memory-web-api', '@angular': 'node_modules/@angular', }; // packages tells the System loader how to load when no filename and/or no extension var packages = { 'app': { main: 'main.js', defaultExtension: 'js' }, 'rxjs': { defaultExtension: 'js' }, 'angular2-in-memory-web-api': { defaultExtension: 'js' }, }; var packageNames = [ '@angular/common', '@angular/compiler', '@angular/core', '@angular/http', '@angular/platform-browser', '@angular/platform-browser-dynamic', '@angular/router', '@angular/router-deprecated', '@angular/testing', '@angular/upgrade', ]; // add package entries for angular packages in the form '@angular/common': { main: 'index.js', defaultExtension: 'js' } packageNames.forEach(function(pkgName) { packages[pkgName] = { main: 'index.js', defaultExtension: 'js' }; }); var config = { map: map, packages: packages } // filterSystemConfig - index.html's chance to modify config before we register it. if (global.filterSystemConfig) { global.filterSystemConfig(config); } System.config(config); })(this);
tsconfig.json
{ "compilerOptions": { "target": "es5", "module": "commonjs", "moduleResolution": "node", "sourceMap": true, "emitDecoratorMetadata": true, "experimentalDecorators": true, "removeComments": false, "noImplicitAny": false }, "exclude": [ "node_modules", "typings/main", "typings/main.d.ts" ] }
可能的问题可能是 
这是抵制我的进步。
遵循Angular Heroes教程时，我遇到了这个问题。 这是由systemjs.config.js文件中的angular-in-memory-web-api导入的无效位置引起的。 正确的位置应该是：
'angular-in-memory-web-api': 'npm:angular-in-memory-web-api/bundles/in-memory-web-api.umd.js'
并删除packages.angular-in-memory-web-api
见https://github.com/angular/quickstart/commit/541bdc5f634e1142860c56cace247234edfaf74b
问题是我的一项服务是无效的。 我已经添加了构造函数作为演示目的的最后一种方法之一，它拒绝加载。
所以对于那些会遇到这个错误的人来说，打开这个错误并检查引用的文件是否有错误。 问题不是他没有发现traceur，而是他无法加载文件。
如果它帮助任何人，两次我遇到过这个问题，这是由多行注释引起的（见Picci 在这里的答案为例）。
从RC4移植到RC6时，我遇到了同样的错误。
对于我的项目，我不得不更新systemjs.config.js文件。 我停止引用根index.js文件，并开始引用/ bundles中的core.umd.js文件。
以下为例 ：
在我的情况下， 我甚traceur没有把traceur作为traceur中的依赖 node_modules ，而且应用程序工作正常，但是在添加一个不需要traceur的库之后，突然间开始询问traceur 。
解决的办法是从bundles文件夹中引用新添加的库，而不是system.config.js的src （或默认文件夹），并指定文件的.umd.js版本。 另外，我必须从packages部分删除main条目。
其原因在于，从bundle文件夹加载umd模块不会触发traceur转换器，因为它假设库模块已经是正确的格式。 否则，可能会认为代码是在es2015编写的，需要进行编译，以便调用traceur 。
在尝试从AngularFire2的帮助下完美运行的“Tour of Heroes”应用程序连接到Firebase实例后，我遇到了这个traceur问题。 我尝试了所有的答案，但没有一个帮助，所以我google了，直到我发现这个github 问题 。
我花了3个小时，试图弄清楚我的代码有什么问题，我能够发现“评论我的一段代码导致了这个问题”。
所以请确保你没有在组件范围之外评论你的任何代码
问题出在system.js我想：
有一个正则expression式，用来检测import语句：
var esmRegEx = /(^\s*|[}\);\n]\s*)(import\s*(['"]|(\*\s+as\s+)?[^"'\(\)\n;]+\s*from\s*['"]|\{)|export\s+\*\s+from\s+["']|export\s*(\{|default|function|class|var|const|let|async\s+function))/;
这个正则expression式会检测多行注释中的import语句，并导致这个可怕的错误。 我在这里开了一个问题：
@Coquelicot给了一个类似的答案，但我想我会回答，因为我有一点点细节。 我通常不会有任何使用多行注释的问题，但是如果我把一个import语句放在一个里面，那么我会得到这个确切的错误。 只要在import声明中加上引号就可以消除我的错误。 很奇怪。
由于版本更改，会引发404错误。 要解决这个问题，我们需要在systemjs.config.js文件中做下面的修改：
-
replace
npm:angular-in-memory-web-api/与npm:angular-in-memory-web-api/bundles/in-memory-web-api.umd.js在地图上。 -
在软件包中删除以下代码：
'angular-in-memory-web-api': { main: './index.js', defaultExtension: 'js' }
在asp.net mvc上运行angular4 quickstart项目时出现此错误。 在tsconfig.json中将“es2015”改为“commonjs”解决了我的问题。
我有同样的问题，在我为这个案例search后，然后我解决了改变： 核心问题：主要：'index.js'必须改为主：'bundles / core.umd.js'
packageNames.forEach(function(pkgName) { packages[pkgName] = { main: 'index.js', defaultExtension: 'js' }; });
=> main：'bundles / core.umd.js'
packages: { '@angular/core': { main: 'bundles/core.umd.js' }, '@angular/compiler': { main: 'bundles/compiler.umd.js' }, '@angular/common': { main: 'bundles/common.umd.js' }, '@angular/platform-browser': { main: 'bundles/platform-browser.umd.js' }, '@angular/platform-browser-dynamic': { main: 'bundles/platform-browser-dynamic.umd.js' }, '@angular/http': { main: 'bundles/http.umd.js' } }
注意：我的地图：
map: { '@angular': 'node_modules/@angular', 'rxjs': 'node_modules/rxjs' }
我有同样的问题，它不能加载我的文件之一。 我打开文件，一切正常。
问题是我有一个片段在同一个文件中注释掉。 片段包含此关键字“ 导出类 ”。 即使它被注释掉了，它也被Angularparsing了。
确保你的注释中没有“ 导出类 ”关键字，并且删除临时注释的代码，只是为了检查它是否工作。
这个错误背后有多重原因，
1）有时在app.component.ts文件的顶部提到注释
2）指向不正确的umd文件
3）如果您使用的是ts（Typescript）版本，请在config.js文件中提及transpiler选项，或者使用transpiler将所有.ts文件编译为.js文件，然后在代码中引用.js文件：
(function (global) { System.config({ transpiler: 'ts', typescriptOptions: { tsconfig: true }, paths: { // paths serve as alias 'npm:': 'node_modules/' }, // map tells the System loader where to look for things map: { // our app is within the app folder app: 'app', // angular bundles '@angular/core': 'npm:@angular/core/bundles/core.umd.js', '@angular/common': 'npm:@angular/common/bundles/common.umd.js', '@angular/compiler': 'npm:@angular/compiler/bundles/compiler.umd.js', '@angular/platform-browser': 'npm:@angular/platform-browser/bundles/platform-browser.umd.js', '@angular/platform-browser-dynamic': 'npm:@angular/platform-browser-dynamic/bundles/platform-browser-dynamic.umd.js', '@angular/http': 'npm:@angular/http/bundles/http.umd.js', '@angular/router': 'npm:@angular/router/bundles/router.umd.js', '@angular/forms': 'npm:@angular/forms/bundles/forms.umd.js', // other libraries 'rxjs': 'npm:rxjs', 'angular-in-memory-web-api': 'npm:angular-in-memory-web-api', 'angular2' : '' }, // packages tells the System loader how to load when no filename and/or no extension packages: { app: { main: './main', defaultExtension: 'ts' }, rxjs: { defaultExtension: 'js' }, 'angular-in-memory-web-api': { main: './index.js', defaultExtension: 'js' } } }); })(this);
首先，你应该编译你的TypeScript文件
$ tsc
命令。 如果您在节点环境外运行应用程序，则应手动编译TypeScript文件。
另外检查tsconfig.json – 如果脚本版本设置为Angular 2.0的ES6
对我来说，发生了什么事是一个同事删除了一个TypeScript文件，这意味着我有一个旧的* .js文件不再需要（因为我们的源代码pipe理忽略这些文件）。 如果traceur错误引用了不需要的* .js文件，请删除该文件。
我有这个确切的问题，这是通过更正文件的名称解决。
我认为你应该做的第一件事是检查你是否有下载traceur！我遇到了这个问题，它标志着我几个小时search.But我发现没有traceur在我的node_modules目录。 所以我试试npm install traceur来安装traceur。然后更新systemjs.config.js ，添加一行'traceur':'npm:traceur/bin/traceur.js' 。 幸运的是，这个问题已经解决了。希望这可以帮助你！
