首页 文章

如何从嵌套模块导入?

提问于
浏览
0

我有一个我编写的Typescript库,它的发出方式如下 . 不过,我不知道如何从这个模块导入 .

node_modules/my-module/dist/index.js (部分)

define("services/UserService", ["require", "exports", ..., "services/BaseService"], function (require, exports, ..., BaseService_31) {
    "use strict";
    var UserService = (function (_super) {
        // ... stuff here ...

        return UserService;
    }(BaseService_31.BaseService));
    exports.UserService = UserService;
});

我用 npm 安装了这个包,并按如下方式配置了JSPM:

config.js (部分)

System.config({
  defaultJSExtensions: true,
  transpiler: "none",
  paths: {
    "*": "dist/*",
    "github:*": "jspm_packages/github/*",
    "npm:*": "jspm_packages/npm/*",
    "npm-ext:*": "node_modules/*"
  },
  map: {
    ...
    "my-module": "npm-ext:my-module/dist/index.js",
    ...
  }
});

我期待能够导入这个类如下...

import {UserService} from "my-module/services/UserService";

我希望SystemJS解析 my-module 的路径,然后找到 services/UserService 模块,并获取单个导出 UserService . 但是在Chrome控制台中,我看到这是正在加载的路径:

node_modules/my-module/dist/index.js/models/UserService.js

导入这样的模块的正确方法是什么?

额外奖励:我怎样才能包括 index.js 的完整路径?

1 回答

  • 0

    您的库代码是使用命名定义发出的

    define("services/UserService",
    

    看起来index.js文件中定义了几个这样的模块,也就是说,index.js是一个bundle .

    使用SystemJS导入此类模块的唯一方法是

    import {UserService} from "services/UserService";
    

    也就是说,导入的模块名称必须与 define 的名称完全匹配 . 在您的情况下,文件的位置不会以任何方式影响模块名称 .

    现在,SystemJS必须配置为在看到导入时加载库文件 node_modules/my-module/dist/index.js . 对于bundle,首选方法是通过bundles config

    bundles: {
        "npm-ext:my-module/dist/index.js": ["services/UserService.js"]
      }
    

    此处的模块名称 services/UserService.js 必须具有 .js 扩展名,因为在应用 defaultJSExtesions:true 后,它必须与导入的模块名称匹配 .

    如果要将模块导入为 my-module/services/UserService.js ,则需要确保使用该名称注册该模块 . 最简单的方法是在编译库时拥有相应的源文件结构 - 也就是说,在 my-module/services 文件夹中有UserService.ts .

    您可以在SystemJS module format docs中找到有关命名定义的更多信息,特别是说

    支持命名定义,并将直接写入加载器注册表 . 单个命名的define将写入loader注册表,但如果名称不匹配,也会被视为加载的模块的值 . 这样就可以加载一个包含define的模块('jquery',....

    P.S. 您的浏览器尝试加载

    node_modules/my-module/dist/index.js/models/UserService.js
    

    models 来自哪里?

相关问题