Question

我正在寻找这个问题的解决方案我正在使用Angular2，但我有这个错误，任何人都可以帮助我：

`"(SystemJS) Unexpected token import
  SyntaxError: Unexpected token import
  at Object.eval (http://....../app.module.js:14:25)
  at eval (http://....../app.module.js:45:4)
  at eval (http://....../app.module.js:46:3)
  Evaluating http://....../node_modules/ng2-bootstrap/index.js
  Evaluating http://....../app.module.js
  Evaluating http://....../main.js
  Error loading http://....../main.js"`

这是我的导航控制台响应

我的index.html：

<!DOCTYPE html>
 <html>
   <head>
  <base href="/">
    <title>Angular QuickStart</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="consultation/css/styles.css">
<link rel="stylesheet" href="consultation/css/ng2-select.css">
<!--link rel="stylesheet" href="consultation/css/angular/forms.css"-->

<link rel="stylesheet" href="https://unpkg.com/bootstrap@3.3.7/dist/css/bootstrap.min.css">

<link href="https://cdnjs.cloudflare.com/ajax/libs/ag-grid/4.0.6/styles/ag-grid.css" rel="stylesheet" />
<link href="https://cdnjs.cloudflare.com/ajax/libs/ag-grid/4.0.6/styles/theme-fresh.css" rel="stylesheet" />
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script src="https://unpkg.com/ng2-bootstrap@1.1.5/bundles/ng2-bootstrap.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<!--script src="https://cdnjs.cloudflare.com/ajax/libs/angular.+js/2.0.0-beta.15/http.dev.js"></script-->
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/2.0.0-beta.15/router.min.js"></script>


<!-- 1. Load libraries -->
<!-- IE required polyfills, in this exact order -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/es6-shim/0.35.0/es6-shim.min.js"></script>
<!--script src="https://cdnjs.cloudflare.com/ajax/libs/systemjs/0.19.26/system-polyfills.js"></script-->
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/2.0.0-beta.15/router.dev.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/systemjs/0.20.5/system.js"></script>
<!--script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/2.0.0-beta.15/angular2-polyfills.js"></script-->

<script src="https://cdnjs.cloudflare.com/ajax/libs/typescript/2.2.0/typescript.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/rxjs/5.1.0/Rx.js"></script>
<!--script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/2.0.0-beta.15/angular2.dev.js"></script-->


<!-- Polyfill(s) for older browsers -->
<script src="consultation/node_modules/core-js/client/shim.min.js"></script>

<script src="consultation/node_modules/zone.js/dist/zone.js"></script>
<script src="consultation/node_modules/reflect-metadata/Reflect.js"></script>
<script src="consultation/node_modules/systemjs/dist/system.src.js"></script>

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

 <body>
   <my-app>Loading AppComponent content here ...</my-app>
 </body>
</html>

my ** systemjs.config.js：**

(function (global) {
 System.config({
paths: {
  // paths serve as alias
  'npm:': 'consultation/node_modules/'
},
// map tells the System loader where to look for things
map: {
  // our app is within the app folder
  app: 'consultation',
  // 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',
  '@angular/material': 'npm:@angular/material/bundles/material.umd.js',
  '@angular/material/radio': 'npm:@angular/material/radio/radio.js',
  '@angular/material/button': 'npm:@angular/material/button/button.js',
  // other libraries
  'rxjs':                      'npm:rxjs',
  'angular-in-memory-web-api': 'npm:angular-in-memory-web-api/bundles/in-memory-web-api.umd.js',
  'ag-grid-ng2' : 'npm:ag-grid-ng2',
  'ag-grid' : 'npm:ag-grid',
  'ag-grid-enterprise' : 'npm:ag-grid-enterprise',
  'ng2-bootstrap' : 'npm:ng2-bootstrap',
  'moment': 'npm:moment/moment.js',
  'ng2-bootstrap/ng2-bootstrap': 'npm:ng2-bootstrap/bundles/ng2-bootstrap.umd.js',
  'moment': 'npm:moment',
  'traceur':'npm:traceur/bin'



},
// packages tells the System loader how to load when no filename and/or no extension
packages: {

   app: {
    main: 'main',
    defaultExtension: 'js'
  },
  'rxjs': {
    defaultExtension: 'js'
  },
  'angular2-in-memory-web-api': {
    main: './index.js',
    defaultExtension: 'js'
  },
  'ng2-bootstrap':  { 
    format: 'cjs', 
    main: './index.js', 
    defaultExtension: 'js' 
  }, 
   '@angular/material':  { 
    format: 'cjs', 
    defaultExtension: 'js' 
  }, 
  moment : {
    main: 'moment.js',
    defaultExtension: 'js' 
  },
  traceur:{
    main: 'traceur'
  }    
}
 });
 })(this);

我的 app.module.ts

import { NgModule, Component }      from '@angular/core';
import {} from 'angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { FormsModule }   from '@angular/forms';
import { TypeaheadModule } from 'ng2-bootstrap';
import { MaterialModule } from '@angular/material';
//import { HttpModule } from '@angular/http';
import { AppComponent }  from './app.component';
import { TypeaheadComponent } from './typeahead.component';
import { SelectComponent } from './select.component';
import {DslamService} from './dslam.service';
@NgModule({
  //providers: [InMemoryDbService,  InMemoryBackendConfig, InMemoryBackendConfigArgs],
  bootstrap:    [ AppComponent ],
  imports: [ 
    BrowserModule,
    //HttpModule,
    TypeaheadModule.forRoot(),
    MaterialModule.forRoot(),
    FormsModule    
    ],

  declarations: [ 
    AppComponent,
    TypeaheadComponent,
    SelectComponent
   ],
    providers: [DslamService]

    })
    export class AppModule { }

最后这是我的 main.js

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


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

platformBrowserDynamic().bootstrapModule(AppModule);

请任何人帮助我

Answer 1

您可能已经修复了它，但每次我收到错误消息时，通常都与import指令中的错误路径有关：

import { SomeModule } './wrongpath';

angular2（SystemJS）意外的令牌导入

1 个答案: