如何包含角度为2的JavaScript库？

如何使用angular 2的JavaScript库？我总是得到一个错误，说它不是一个模块。如何包含角度为2的JavaScript库？

如果我将脚本标记添加到指向javascript文件的index.html文件中，然后将其添加到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'.

来源

2016-07-07 gattsbr

'alert（“Hello，world！”）;' – Legionar

我的系统js.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);

将它包含在这个map变量中。

将'xlsx'：{defaultExtension：'js'}添加到软件包变量中。那么在您的index.html添加

来源

2016-07-07 15:02:35 Colum

好的，我已将它添加到地图变量中。所以现在map也包含：''xlsx'：'../ node_modules/xlsx/xlsx.js''然而它仍然是与上面相同的错误。 – gattsbr

还添加了''xlsx'：{defaultExtension：'js'}，'给包变量。然后在你的index.html中添加 '''' – Colum

'后面我已经添加到包中，并且添加了'to index.html body - 仍然是相同的错误 – gattsbr

也许这有助于以后：

我注意到，您试图执行sheetjs/XLSX库。有一个可用的打字稿可用的XLSX库here，它可以与angular2一起使用！

如果您正在寻找一个工作演示，请看看here。

来源

2017-01-26 15:12:15 kkarli

您不包含您的index.html内容，但我认为 <script src="../node_modules/xlsx/xlsx.js" type="text/javascript"></script>标记是在您的基本组件之前导入的。如果是这样，那么尝试在基本组件和打字稿使用后导入脚本：declare var xlsx:any;

来源

2017-06-13 19:46:58

如何包含角度为2的JavaScript库？

回答

相关问题