[英]Angular 2 giving an error Uncaught SyntaxError: Unexpected token <
我正在嘗試在現有項目上運行angular 2,並且執行以下代碼:
<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
import {bootstrap} from 'angular2/platform/browser'
import {FeedComponent} from 'assets/js/angular2/app/feed.component.js'
bootstrap(FeedComponent)
feed.component.ts
import { Component } from '@angular/core';
@Component({
selector: 'feeds',
template: 'assets/partials/wall/Feeds.html'
})
export class FeedComponent {
}
html
<feeds>
loading...
</feeds>
但是它給出了一個錯誤:
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
請讓我知道我在做什么錯以及如何解決此問題。
提前致謝 :)
您正在使用哪個版本的angular2?
似乎您正在與angular2 beta和angular2 rc版本混合使用。
在發行候選中:
import { Component } from '@angular/core';
和以前的版本
import {bootstrap} from 'angular2/platform/browser'
如果繼續進行rc,則可以使用:
在候選版本中,您不應在腳本標簽中添加角度庫,
相反,您應該在系統js配置中執行模塊
系統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' },
}
});
我認為您可以更換
import {FeedComponent} from 'assets/js/angular2/app/feed.component.js'
與
import {FeedComponent} from 'assets/js/angular2/app/feed.component'
對於您,在系統js配置中將默認文件擴展名指定為“ ts”。 不知道這是否是根本原因。 請先嘗試。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.