Question

我编写了一个带有一些导出函数的es6模块，并将其上传到npm（上传了它编译的es5代码）。

我正在尝试在Angular项目中使用此包，该项目使用SystemJS作为模块加载器（它是AngularJS 1.5和Angular 5.2的混合应用程序，在迁移过程中）。

我在systemjs.config.js中添加了新库，类似于我添加rxjs（将其指向node_modules下的路径）。

但是当尝试使用模块的一个公共函数时，IntelliJ不知道从哪里导入它（例如，当使用rxjs的noop函数时它就知道了），并且如果我手动添加import语句（import {来自'package-name'的func-name}，然后TypeScript编译器抛出错误。

有什么建议吗？我是否需要将我发布的模块中的某些内容更改为npm，或者我正在尝试使用Angular中的模块函数？

感谢。

角度代码

systemjs.config.js：

map: {
      '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',
      '@angular/upgrade/static': 'npm:@angular/upgrade/bundles/upgrade-static.umd.js',

      // other libraries
      'rxjs'                     : 'npm:rxjs',
      .
      .
      'my-package'               : 'npm:my-package/dist/my-package.js'
    },

MY-component.component.ts：

import { func } from 'my-package';
.
.
.
ngAfterContentInit() {
    func();
}

TypeScript编译器错误：

error TS2307: Cannot find module 'package-name'

Answer 1

在我更改npm包以构建umd版本之后，它现在可以正常工作。

在systemjs.config.js中：

'my-package': 'npm:my-package/dist/my-package.umd.js'

此外，为我的npm包（TypeScript定义文件）生成index.d.ts文件，使IntelliJ为库的函数执行自动导入，并使tsc不会因“找不到模块”错误而失败。 / p>

在Angular中导入外部模块函数

1 个答案: