Angular SystemJS Builder不包括捆绑包中的FullCalendar

我正在使用SystemJS builder构建一个angular 2应用程序。Priming的计划组件取决于fullcalendar。生成器的执行似乎没有问题，但当我运行应用程序时，会出现以下错误：

Error: Error in ./ScheduleComponent class ScheduleComponent - inline template:0:5 caused by: this.schedule.fullCalendar is not a function
TypeError: this.schedule.fullCalendar is not a function

除此错误外，输出包中除来自Priming的调用外，不包含对FullCalendar或moment的引用

以下是我的设置：

package.json

{
  "version": "1.0.0",
  "name": "asp.net",
  "private": true,
  "dependencies": {
    "@angular/common": "~2.2.0",
    "@angular/compiler": "~2.2.0",
    "@angular/core": "~2.2.0",
    "@angular/forms": "~2.2.0",
    "@angular/http": "~2.2.0",
    "@angular/platform-browser": "~2.2.0",
    "@angular/platform-browser-dynamic": "~2.2.0",
    "@angular/router": "~3.2.0",
    "@types/node": "0.0.2",
    "core-js": "^2.4.1",
    "fullcalendar": "^3.1.0",
    "primeng": "^1.0.1",
    "reflect-metadata": "^0.1.8",
    "rxjs": "5.0.0-beta.12",
    "zone.js": "^0.6.26"
  },
  "devDependencies": {
    "@types/jquery": "^2.0.34",
    "cssmin": "^0.4.3",
    "del": "^2.2.2",
    "font-awesome": "^4.7.0",
    "gulp": "^3.9.1",
    "gulp-concat": "^2.6.1",
    "gulp-cssmin": "^0.1.7",
    "gulp-inline-ng2-template": "^4.0.0",
    "gulp-sourcemaps": "^1.9.1",
    "gulp-tslint": "^7.0.1",
    "gulp-typescript": "^3.1.3",
    "gulp-typescript-cs-poco": "^1.11.0",
    "gulp-uglify": "^2.0.0",
    "gulp-watch": "^4.3.11",
    "html-minifier": "^3.2.3",
    "systemjs-builder": "^0.15.34",
    "tslint": "^4.0.2",
    "typescript": "^2.0.10",
    "typescript-cs-poco": "^1.11.0"
  }
}

SystemJS.config.js

/**
 * System configuration for Angular samples
 * Adjust as necessary for your application needs.
 */
(function (global) {
  System.config({
    format: "system",
    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': 'Components',

      // 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',

      'jquery': 'npm:jquery',

      'rxjs': 'npm:rxjs',

      'fullcalendar': 'npm:fullcalendar',
      'primeng': 'npm:primeng'
    },
    // packages tells the System loader how to load when no filename and/or no extension
    packages: {
      'app': { main: 'main.js', defaultExtension: 'js' },
      'jquery': { main: 'dist/jquery.js', defaultExtension: 'js' },
      'fullcalendar': { main: 'dist/fullcalendar.js', defaultExtension: 'js' },
      'rxjs': { defaultExtension: 'js' },
      'primeng': { defaultExtension: 'js' }
    }
  });
})(this);

import 'fullcalendar'

---

感谢您的帮助

我通过在主模块中添加以下内容来修复此问题：

main.ts

/**
 * System configuration for Angular samples
 * Adjust as necessary for your application needs.
 */
(function (global) {
  System.config({
    format: "system",
    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': 'Components',

      // 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',

      'jquery': 'npm:jquery',

      'rxjs': 'npm:rxjs',

      'fullcalendar': 'npm:fullcalendar',
      'primeng': 'npm:primeng'
    },
    // packages tells the System loader how to load when no filename and/or no extension
    packages: {
      'app': { main: 'main.js', defaultExtension: 'js' },
      'jquery': { main: 'dist/jquery.js', defaultExtension: 'js' },
      'fullcalendar': { main: 'dist/fullcalendar.js', defaultExtension: 'js' },
      'rxjs': { defaultExtension: 'js' },
      'primeng': { defaultExtension: 'js' }
    }
  });
})(this);

import 'fullcalendar'

---

我通过在主模块中添加以下内容来修复此问题：

main.ts

/**
 * System configuration for Angular samples
 * Adjust as necessary for your application needs.
 */
(function (global) {
  System.config({
    format: "system",
    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': 'Components',

      // 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',

      'jquery': 'npm:jquery',

      'rxjs': 'npm:rxjs',

      'fullcalendar': 'npm:fullcalendar',
      'primeng': 'npm:primeng'
    },
    // packages tells the System loader how to load when no filename and/or no extension
    packages: {
      'app': { main: 'main.js', defaultExtension: 'js' },
      'jquery': { main: 'dist/jquery.js', defaultExtension: 'js' },
      'fullcalendar': { main: 'dist/fullcalendar.js', defaultExtension: 'js' },
      'rxjs': { defaultExtension: 'js' },
      'primeng': { defaultExtension: 'js' }
    }
  });
})(this);

import 'fullcalendar'

---

我在index.html中包含fullcalendar：可能作为临时修复程序对您有效。我在index.html中包含fullcalendar：可能作为临时修复程序对您有效。