ExcelJS, загруженный с использованием конфигурации System.js, не показывает ошибок, но приложение Angular не загружается - PullRequest
0 голосов
/ 25 декабря 2018

Я пытаюсь загрузить файл-заставку и exceljs в свой пользовательский веб-проект, где угловое приложение загружается отдельно во время выполнения, так как это старый веб-проект на основе сервлетов JSP, на котором я не строил весь угловой проект отдельноCLI.Я использую файлы конфигурации systemjs для загрузки модулей.Файл-заставка работает нормально, но когда я пытаюсь использовать exceljs, угловое приложение не загружается.На консоли также не выдается никаких ошибок.

Это мой файл systemjs.config.js

/**
 * WEB ANGULAR VERSION
 * (based on systemjs.config.js in angular.io)
 * System configuration for Angular samples
 * Adjust as necessary for your application needs.
 */
(function (global) {
  System.appVersion='2.13';
  System.config({
    transpiler: 'ts',
    typescriptOptions: {
      "target": "es5",
      "module": "system",
      "moduleResolution": "node",
      "sourceMap": true,
      "emitDecoratorMetadata": true,
      "experimentalDecorators": true,
      "lib": ["es2015", "dom"],
      "noImplicitAny": true,
      "suppressImplicitAnyIndexErrors": true
    },
    meta: {
      'typescript': {
        "exports": "ts"
      }
    },
    paths: {
      // paths serve as alias
      'npm:': 'https://unpkg.com/'
    },
    // map tells the System loader where to look for things
    map: {
      // our app is within the app folder
      'app': './../app',

      // angular bundles
      '@angular/animations': './../js/angular4/@angular-4.4.6/animations.umd.js',
      '@angular/animations/browser': './../js/angular4/@angular-4.4.6/animations-browser.umd.js',
      '@angular/core': './../js/angular4/@angular-4.4.6/core.umd.js',
      '@angular/common': './../js/angular4/@angular-4.4.6/common.umd.js',
      '@angular/common/http': './../js/angular4/@angular-4.4.6/common-http.umd.js',
      '@angular/compiler': './../js/angular4/@angular-4.4.6/compiler.umd.js',
      '@angular/platform-browser': './../js/angular4/@angular-4.4.6/platform-browser.umd.js',
      '@angular/platform-browser/animations': './../js/angular4/@angular-4.4.6/platform-browser-animations.umd.js',
      '@angular/platform-browser-dynamic': './../js/angular4/@angular-4.4.6/platform-browser-dynamic.umd.js',
      '@angular/http': './../js/angular4/@angular-4.4.6/http.umd.js',
      '@angular/router': './../js/angular4/@angular-4.4.6/router.umd.js',
      '@angular/router/upgrade': './../js/angular4/@angular-4.4.6/router-upgrade.umd.js',
      '@angular/forms': './../js/angular4/@angular-4.4.6/forms.umd.js',
      '@angular/upgrade': './../js/angular4/@angular-4.4.6/upgrade.umd.js',
      '@angular/upgrade/static': './../js/angular4/@angular-4.4.6/upgrade-static.umd.js',

      // other libraries
      'rxjs':                      'npm:rxjs@5.0.1',
      'tslib':                     './../js/angular4/typescript@2.3.2/tslib@1.8.1.js',

      'ts':                        './../js/angular4/typescript@2.3.2/plugin-typescript@5.2.7.js',
      'typescript':                './../js/angular4/typescript@2.3.2/typescript.js',

      'lodash':                    './../js/angular4/lodash@4.17.4.js',           
      'exceljs':                   './../js/angular4/exceljs',
      'file-saver':                'npm:file-saver',

      //Datatable-Locally maintained
      'angular-2-datatable':        './../js/angular4/Angular-2-Datatable'    

    },
    // packages tells the System loader how to load when no filename and/or no extension
    packages: {
      app: {
        main: 'main',
        defaultExtension: 'ts?v='+System.appVersion,
        /*meta: {
          './*.ts': {
            loader: 'systemjs-angular-loader.js'
          }
        }*/
      },
      rxjs: {
        defaultExtension: 'js'
      },
      'exceljs': {
        main: './dist/dist/es5/exceljs.browser.js',
        defaultExtension: 'js'
      },
     // 'angular2-datatable': { defaultExtension: 'js' },    
     //'ngx-filter-pipe': { main: 'dist/bundles/ngx-filter-pipe.umd.js' },
     'angular-2-datatable': {
         main: 'index.js',
         defaultExtension: 'js'
      },
      'file-saver': {
        format: 'global',
        main: './dist/FileSaver.js',
        defaultExtension: 'js'
      }
    }
  });

})(this);

Здесь я использую ExcelJS

import * as Excel from 'exceljs';
import { saveAs } from 'file-saver';

export class AlertSubscriptionExportExcel {
    static export = (data: any) => {    
        const workbook: Excel.Workbook = new Excel.Workbook;
        const worksheet = workbook.addWorksheet('Car Data');

        const title = "Alert Subscription Report";
        const titleRow = worksheet.addRow([title]);

        worksheet.addRow([]);
        worksheet.addRow([]);
        worksheet.addRow([]);
        worksheet.addRow([]);


}

Я такжевключите следующий журнал в мой файл main.ts

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

export const environment = {
        production: false
      };

if (environment.production) {
    enableProdMode();
  }
console.log('Bootstrap AppModule >>>>');
platformBrowserDynamic().bootstrapModule(AppModule);

Журнал распечатывается, но после этого ничего не происходит ..

Если я прокомментирую строку, где я использую объект Workbook, приложение загружаетбез каких-либо хлопот.

Где я здесь не так?

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...