Как включить javascript-библиотеку с угловым 2?

Question

Как использовать библиотеку javascript с угловым 2? Я всегда получаю сообщение о том, что это не модуль.

Если я добавлю тег скрипта в файл index.html, указывающий на файл javascript, затем добавьте его под пути в System.config, затем импортируйте его, я получаю сообщение об ошибке, в котором говорится, что это не модуль.

Я уже пробовал this, и я также пробовал this. Ни один из них не работает, несмотря на то, что им, похоже, нравится указывать, что это легко, и что вы можете использовать любую из сотен библиотек.

Вот Javascript библиотека: sheetjs

Как сделать эту работу в угловом 2?

index.html

<script src="../node_modules/xlsx/xlsx.js" type="text/javascript"></script> 

система-config.ts

System.config({ 
... 
    path: { 
     xlsx: '../node_modules/xlsx/xlsx.js' 
    } 
}); 

something.ts сообщение

import * as xlsx from 'xlsx'; 

Ошибка:

Error: Typescript found the following errors: 
    C:/___/tmp/broccoli_type_script_compiler-input_base_path-o4TZ9PSC.tmp/0/src/app/something/something.component.ts (9, 23): Cannot find module 'xlsx'. 

Answer 1

мои systemjs.config.js

(function(global) { 
     // map tells the System loader where to look for things 
     var map = { 
     'src':      'src', // 'dist', 
     'bin':      'bin', 
     '@angular':     '/node_modules/@angular', 
     'angular2-in-memory-web-api': '/node_modules/angular2-in-memory-web-api', 
     'rxjs':      '/node_modules/rxjs' 
     }; 
     // packages tells the System loader how to load when no filename and/or no extension 
     var packages = { 
     'src':      { defaultExtension: 'js' }, 
     'bin':      { defaultExtension: 'js' }, 
     'rxjs':      { defaultExtension: 'js' }, 
     'angular2-in-memory-web-api': { main: 'index.js', defaultExtension: 'js' }, 
     }; 
     var ngPackageNames = [ 
     'common', 
     'compiler', 
     'core', 
     'http', 
     'platform-browser', 
     'platform-browser-dynamic', 
     'router', 
     'router-deprecated', 
     'upgrade', 
     ]; 
     // Individual files (~300 requests): 
     function packIndex(pkgName) { 
     packages['@angular/'+pkgName] = { main: 'index.js', defaultExtension: 'js' }; 
     } 
     // Bundled (~40 requests): 
     function packUmd(pkgName) { 
     packages['@angular/'+pkgName] = { main: pkgName + '.umd.js', defaultExtension: 'js' }; 
     }; 
     // Most environments should use UMD; some (Karma) need the individual index files 
     var setPackageConfig = System.packageWithIndex ? packIndex : packUmd; 
     // Add package entries for angular packages 
     ngPackageNames.forEach(setPackageConfig); 
     var config = { 
     map: map, 
     packages: packages 
     } 
     System.config(config); 
    })(this); 

включить его в переменной карты в этом.

добавить 'xlsx': {defaultExtension: 'js'} к переменной пакетов. то в вашем index.html добавить после

Answer 2

Может быть, это помогает:

Я заметил, что вы пытаетесь реализовать sheetjs/XLSX библиотеку. Существует рабочая библиотека XLSX для машинописного текста here, которая работает с угловым2!

Если вы ищете рабочую демонстрационную версию, посмотрите here.

Answer 3

Вы не указали свой контент index.html, но я полагаю, что тег <script src="../node_modules/xlsx/xlsx.js" type="text/javascript"></script> импортирован перед вашим базовым компонентом. Если это правда, попробуйте импортировать скрипт после использования базового компонента и на использование машинописного текста: declare var xlsx:any;