Angular 2给出错误Uncaught SyntaxError:意外令牌< [英] Angular 2 giving an error Uncaught SyntaxError: Unexpected token <

问题描述

我正在尝试在现有项目中运行angular 2，并且遵循以下代码:

I am trying to run angular 2 on my existing project and I've following codes :

<script src="https://code.angularjs.org/2.0.0-beta.0/angular2-polyfills.js"></script>
<script src="https://code.angularjs.org/tools/system.js"></script>
<script src="https://code.angularjs.org/tools/typescript.js"></script>
<script src="https://code.angularjs.org/2.0.0-beta.0/Rx.js"></script>
<script src="https://code.angularjs.org/2.0.0-beta.0/angular2.dev.js"></script>
<script type="text/javascript">
    System.config({
        transpiler: 'typescript', 
        typescriptOptions: { emitDecoratorMetadata: true }, 
        packages: {app: {defaultExtension: 'ts'}} 
      });
      System.import('assets/js/angular2/app/script.js')
            .then(null, console.error.bind(console));
</script>

script.ts

script.ts

import {bootstrap}    from 'angular2/platform/browser'
import {FeedComponent} from 'assets/js/angular2/app/feed.component.js'


bootstrap(FeedComponent)

feed.component.ts

feed.component.ts

import { Component } from '@angular/core';

@Component({
  selector: 'feeds',
  template: 'assets/partials/wall/Feeds.html'
})

export class FeedComponent {

}

html

<feeds>
            loading...
          </feeds>

但是它给出了一个错误:

But its giving an error :

core:1 Uncaught SyntaxError: Unexpected token <U @ system.src.js:4597o.execute @ system.src.js:4597i @ system.src.js:4597s @ system.src.js:4597(anonymous function) @ system.src.js:4597(anonymous function) @ feed.component.js:8(anonymous function) @ feed.component.js:22U @ system.src.js:4597c.execute @ system.src.js:4597i @ system.src.js:4597s @ system.src.js:4597(anonymous function) @ system.src.js:4597(anonymous function) @ script.js:3(anonymous function) @ script.js:6U @ system.src.js:4597c.execute @ system.src.js:4597i @ system.src.js:4597n @ system.src.js:4597execute @ system.src.js:4597y @ system.src.js:4597w @ system.src.js:4597p @ system.src.js:4597h @ system.src.js:4597(anonymous function) @ system.src.js:4597run @ angular2-polyfills.js:138zoneBoundFn @ angular2-polyfills.js:111lib$es6$promise$$internal$$tryCatch @ angular2-polyfills.js:1511lib$es6$promise$$internal$$invokeCallback @ angular2-polyfills.js:1523lib$es6$promise$$internal$$publish @ angular2-polyfills.js:1494(anonymous function) @ angular2-polyfills.js:243run @ angular2-polyfills.js:138zoneBoundFn @ angular2-polyfills.js:111lib$es6$promise$asap$$flush @ angular2-polyfills.js:1305
system.src.js:4597 Uncaught Uncaught SyntaxError: Unexpected token <
    Evaluating http://localhost/v010-commonsocialnetwork/@angular/coreU @ system.src.js:4597o.execute @ system.src.js:4597i @ system.src.js:4597s @ system.src.js:4597(anonymous function) @ system.src.js:4597(anonymous function) @ feed.component.js:8(anonymous function) @ feed.component.js:22U @ system.src.js:4597c.execute @ system.src.js:4597i @ system.src.js:4597s @ system.src.js:4597(anonymous function) @ system.src.js:4597(anonymous function) @ script.js:3(anonymous function) @ script.js:6U @ system.src.js:4597c.execute @ system.src.js:4597i @ system.src.js:4597n @ system.src.js:4597execute @ system.src.js:4597y @ system.src.js:4597w @ system.src.js:4597p @ system.src.js:4597h @ system.src.js:4597(anonymous function) @ system.src.js:4597run @ angular2-polyfills.js:138zoneBoundFn @ angular2-polyfills.js:111lib$es6$promise$$internal$$tryCatch @ angular2-polyfills.js:1511lib$es6$promise$$internal$$invokeCallback @ angular2-polyfills.js:1523lib$es6$promise$$internal$$publish @ angular2-polyfills.js:1494(anonymous function) @ angular2-polyfills.js:243run @ angular2-polyfills.js:138zoneBoundFn @ angular2-polyfills.js:111lib$es6$promise$asap$$flush @ angular2-polyfills.js:1305
system.src.js:4597 Uncaught Script error.
    Evaluating http://localhost/v010-commonsocialnetwork/assets/js/angular2/app/feed.component.jsU @ system.src.js:4597c.execute @ system.src.js:4597i @ system.src.js:4597s @ system.src.js:4597(anonymous function) @ system.src.js:4597(anonymous function) @ script.js:3(anonymous function) @ script.js:6U @ system.src.js:4597c.execute @ system.src.js:4597i @ system.src.js:4597n @ system.src.js:4597execute @ system.src.js:4597y @ system.src.js:4597w @ system.src.js:4597p @ system.src.js:4597h @ system.src.js:4597(anonymous function) @ system.src.js:4597run @ angular2-polyfills.js:138zoneBoundFn @ angular2-polyfills.js:111lib$es6$promise$$internal$$tryCatch @ angular2-polyfills.js:1511lib$es6$promise$$internal$$invokeCallback @ angular2-polyfills.js:1523lib$es6$promise$$internal$$publish @ angular2-polyfills.js:1494(anonymous function) @ angular2-polyfills.js:243run @ angular2-polyfills.js:138zoneBoundFn @ angular2-polyfills.js:111lib$es6$promise$asap$$flush @ angular2-polyfills.js:1305
angular2-polyfills.js:138 Script error.
    Evaluating http://localhost/v010-commonsocialnetwork/assets/js/angular2/app/script.js
    Error loading http://localhost/v010-commonsocialnetwork/assets/js/angular2/app/script.js

请让我知道我在做什么错以及如何解决此问题.

Please let me know what I'm doing wrong in it and how to solve this issue.

先谢谢您了:)

推荐答案

您正在使用哪个版本的angular2?

Which version of angular2 you are using?

似乎您正在将angular2 beta和angular2 rc版本混在一起.

It seems you are mixing with angular2 beta and angular2 rc versions.

在候选版本中:

import { Component } from '@angular/core';

和以前的版本

import {bootstrap}    from 'angular2/platform/browser'

如果您继续进行rc，则可以使用:

在候选版本中，您不应在脚本标签中添加角度库，
相反，您应该在系统js配置中将其作为模块

in release candidate you should not add your angular libraries in script tags,
instead you should do in system js config as module

系统js配置示例

System.config({
    transpiler: 'typescript',
    typescriptOptions: { emitDecoratorMetadata: true },
    map: {
        'app': 'app',
        'rxjs': 'libraries/rxjs',
        '@angular': 'libraries/@angular',
    },
    packages: {
        'app': { main: 'main.ts', defaultExtension: 'ts'},
        'rxjs': { main: 'Rx.js' },
        '@angular/core': { main: 'index.js' },
        '@angular/common': { main: 'index.js' },
        '@angular/compiler': { main: 'index.js' },
        '@angular/router': { main: 'index.js' },
        '@angular/platform-browser': { main: 'index.js' },
        '@angular/platform-browser-dynamic': { main: 'index.js' },
        '@angular/http': { main: 'index.js' },
    }
});

这篇关于Angular 2给出错误Uncaught SyntaxError:意外令牌<的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！