（SystemJS）意外的令牌<（ASP.net + Angular 4）

不知道如何解決這個問題;我正嘗試使用ngx-translate動態加載我的本地化值。這是一個與角4 這裏一個asp.net是我System.config.js（SystemJS）意外的令牌<（ASP.net + Angular 4）

(function (global) { 
System.config({ 
    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 
     '@ngx-translate/core': 'npm:@ngx-translate/core/bundles/core.umd.js', 
     '@ngx-translate/http-loader': 'npm:@ngx-translate/http-loader/bundles/http-loader.umd.js', 
     '@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/bundles/in-memory-web-api.umd.js' 

    }, 
    // packages tells the System loader how to load when no filename and/or no extension 
    packages: { 
     app: { 
      main: 'main.js', defaultExtension: 'js', 
       meta: { 
     './*.js': { 
      loader: 'systemjs-angular-loader.js' 
     } 
    } 
     }, 
     rxjs: { 
      defaultExtension: 'js' 
     } 

    } 
}); 
})(this);

這是我的應用程序模塊：

import { BrowserModule } from '@angular/platform-browser'; 
import { NgModule } from '@angular/core'; 
import { FormsModule } from '@angular/forms' 

import { AppComponent } from './app.component'; 

import { TranslateModule, TranslateLoader } from "@ngx-translate/core"; 
import { TranslateHttpLoader } from "@ngx-translate/http-loader"; 
import { HttpClient, HttpClientModule } from "@angular/common/http"; 

// AoT requires an exported function for factories 
export function HttpLoaderFactory(httpClient: HttpClient) { 
    return new TranslateHttpLoader(httpClient, "i18n/", ".json"); 
} 

@NgModule({ 
declarations: [ 
    AppComponent 
], 
imports: [ 
    BrowserModule, FormsModule, AppRoutingModule, TranslateModule.forRoot({ 
     loader: { 
      provide: TranslateLoader, 
      useFactory: HttpLoaderFactory, 
      deps: [HttpClient] 
     } 
    }) 
    ], 
    providers: [], 
bootstrap: [AppComponent] 
}) 
export class AppModule { }

這是我試圖效仿的榜樣。 https://plnkr.co/edit/WccVZSBM0rUgq2sXSUbe?p=preview

這是我得到

Error: (SystemJS) Unexpected token < 
    SyntaxError: Unexpected token < 
     at eval (<anonymous>) 
     at Object.eval (http://localhost:63021/app/app.module.js:25:14) 
     at eval (http://localhost:63021/app/app.module.js:69:4) 
     at eval (http://localhost:63021/app/app.module.js:70:3) 
    Evaluating http://localhost:63021/@ngx-translate/core 
    Evaluating http://localhost:63021/app/app.module.js 
    Evaluating http://localhost:63021/app/main.js 
    Error loading http://localhost:63021/app/main.js 
     at eval (<anonymous>) 
     at Object.eval (http://localhost:63021/app/app.module.js:25:14) 
     at eval (http://localhost:63021/app/app.module.js:69:4) 
     at eval (http://localhost:63021/app/app.module.js:70:3) 
    Evaluating http://localhost:63021/@ngx-translate/core 
    Evaluating http://localhost:63021/app/app.module.js 
    Evaluating http://localhost:63021/app/main.js 
    Error loading http://localhost:63021/app/main.js

錯誤我Main.ts

import { enableProdMode } from '@angular/core'; 
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; 

import { AppModule } from './app.module'; 


platformBrowserDynamic().bootstrapModule(AppModule);

我的項目結構

來源

2017-09-22 Tunisiano32

你有一個main.ts文件？你可以分享這些代碼嗎？你的項目的文件夾結構是什麼？app' – Niladri

你確定這個路徑對你的'app'文件夾是否正確：我們的應用位於應用文件夾 app： '/ app'，'應該是'app：'app''？ – Niladri

我沒有仔細查看你的代碼，但通常'意外的令牌<'是因爲你沒有加載你認爲你應該是的JavaScript文件，而是加載一個404頁面或其他HTML文件。看看正在加載的文件並拋出錯誤，看看它是否指向正確的方向。 – Jonathan

HTTP和HttpClient的是兩個不同的模塊（下角度4.3.4）

添加到systemjs.config.js：

map: { 
     ; 
     '@angular/common/http': 'npm:@angular/common/bundles/common-http.umd.js', 
     'tslib': 'npm:tslib/tslib.js',

添加到您的app.module.ts：

@NgModule({ 
    declarations: [AppComponent], 
    imports: [BrowserModule, FormsModule,HttpClientModule, AppRoutingModule, TranslateModule.forRoot({

見here更多細節

來源

2017-10-12 03:49:08

（SystemJS）意外的令牌<（ASP.net + Angular 4）

回答

相關問題