Как импортировать из вложенного модуля?

Question

У меня есть библиотека машинописного текста, которую я написал, которая испускается следующим образом. Я не уверен, как импортировать из этого модуля.

node_modules/мой-модуль/расстояние/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", 
    ... 
    } 
}); 

Я ожидал, что сможете импортировать эту cla сс следующим ...

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?

Answer 1

Ваш код библиотеки излучается с использованием имени определяют

define("services/UserService", 

И, похоже, есть несколько таких модулей, определенные в файле index.js, то есть index.js является расслоением.

Единственный способ импортировать такой модуль с помощью SystemJS является

import {UserService} from "services/UserService"; 

То есть, ввозимые имя модуля должно совпадать с именем, заданным для define. В вашем случае расположение файла никак не влияет на имя модуля.

Теперь SystemJS должен быть настроен на загрузку файла библиотеки, node_modules/my-module/dist/index.js, когда он видит этот импорт. Для пучков, предпочтительный способ к нему через bundles config:

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

Имя модуля здесь, services/UserService.js, должно иметь .js расширения, потому что он должен соответствовать импортируемому имени модуля после defaultJSExtesions:true применяется.

Если вы хотите, чтобы модуль был импортирован как my-module/services/UserService.js, вам необходимо убедиться, что он зарегистрирован с этим именем. Самый простой способ - иметь соответствующую структуру исходного файла при компиляции библиотеки, то есть иметь UserService.ts в папке my-module/services.

Вы можете найти более подробную информацию о имени определяют в SystemJS module format docs, в котором говорится, в частности,

• Названы определяет поддерживаются и будут писать непосредственно в реестре загрузчика.

• Один и тот же определитель будет записывать в реестр загрузчика, но также обрабатываться как значение загружаемого модуля, если имена не совпадают. Это позволяет загрузить модуль, содержащий определения ('JQuery', ....

PS Ваш браузер пытается загрузить

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

откуда models пришел?