Question

error 嗨，我每次尝试导入新模块时都使用.net + angular 4，例如，现在我导入FusionChartModule时，我得到以下信息我需要在system.config.js文件中添加任何内容吗？

错误是“ https://i.stack.imgur.com/XZgco.png”

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { RouterModule, Routes } from "@angular/router";
import { HttpModule } from '@angular/http';
import * as FusionCharts from 'fusioncharts';
import * as Charts from 'fusioncharts/fusioncharts.charts';
import * as FintTheme from 'fusioncharts/themes/fusioncharts.theme.fint';
import { FusionChartsModule } from 'angular4-fusioncharts';
import { AppComponent } from './app.component';

FusionChartsModule.fcRoot(FusionCharts, Charts, FintTheme);
@NgModule({
declarations: [
    AppComponent
],
imports: [
    BrowserModule,
    FusionChartsModule
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }

我的system.config.js文件我还包含了system.config.js文件，在其中也使用了融合图，但仍然出现该错误

   (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
  '@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',

  'fusioncharts': 'npm:fusioncharts/',
  'angular4-fusioncharts': 'npm:angular4-fusioncharts/dist/'
},
// packages tells the System loader how to load when no filename and/or no extension
packages: {
  app: {
    defaultExtension: 'js',
    meta: {
      './*.js': {
        loader: 'systemjs-angular-loader.js'
      }
    }
  },
  rxjs: {
    defaultExtension: 'js'
  },
  fusioncharts: {
      main: './fusioncharts.js',
      defaultExtension: 'js'
  },
  'angular4-fusioncharts': {
      main: './index.js',
      defaultExtension: 'js'
  }
 }
 });
})(this);

Answer 1

如果使用的是systemjs，则必须将FusionCharts添加到项目目录中的config.js文件中

map: {
...

'fusioncharts': 'npm:fusioncharts/',
'angular2-fusioncharts': 'npm:angular2-fusioncharts/dist/'

},
 //packages defines our app package
 packages: {
 ...
fusioncharts: {
  main: './fusioncharts.js',
  defaultExtension: 'js'
},
'angular2-fusioncharts': {
  main: './index.js',
  defaultExtension: 'js'
}

如果您使用其他版本，您当然需要适应angular2-fusioncharts版本，我发现了这个插件，在那里您可以看到systemjs + angular2的Fusioncharts，如果您也使用angular2-fusionchart，则应该相同，否则修改名称和路径。

Plunker

希望这会有所帮助：）

404错误（SystemJS）XHR错误加载，因为找不到融合图

1 个答案: