TypeScript Псевдоним пути импорта
В настоящее время я работаю над приложением TypeScript, состоящим из нескольких модулей Node, написанных в TypeScript, которые установлены в каталог node_modules
.
Прежде чем продолжить, я хотел бы отметить, что я использую TypeScript 2.0, я не против использования версии 2.1 dev, если это необходимо. Я просто хочу, чтобы это работало.
Структура каждого модуля Node - это что-то вроде строк:
dist/
es2015/
index.js
utils/
Calculator.js
Calculator.d.ts
Date.js
Date.d.ts
Flatpack.js
Flatpack.d.ts
src/
index.ts
utils/
Calculator.ts
Date.ts
Flatpack.ts
Папка dist - это сгенерированный источник, этот путь настраивается с помощью outDir
внутри моего файла tsconfig.json
. Я также настроил свойство main
в моем package.json
как dist/es2015/index.js
.
Важно отметить:
- В моем проекте я использую
moduleResolution
тип node
- Я использую TypeScript 2.0
- Я не спрашиваю, как импортировать файл из пакета. Я устанавливаю пакет через Npm, а затем импортирую его через
packagename/
из приложения, использующего этот модуль.
Теперь мой вопрос/вопрос. При импорте файлов из этого модуля я хотел бы иметь возможность сделать это:
import {Sin, Cos, Tan} from "common-utils/utils/Calculator";
Однако файл не может быть разрешен в каталоге dist/es2015/utils
. В идеале я хотел бы, чтобы мой импорт разрешался из этой конкретной папки dist
, а не из корня, что, как представляется, происходит.
Вышеприведенный импорт должен быть записан следующим образом, чтобы заставить его работать:
import {Sin, Cos, Tan} from "common-utils/dist/es2015/utils/Calculator";
Однако запись dist/es2015
каждый раз не идеальна, и это просто заставляет некоторые из них выглядеть очень долго. Есть ли способ настроить мой модуль для решения в каталоге dist/es2015
? Я не хочу включать переопределения внутри моего проекта, в идеале каждый модуль будет определять, от каких файлов решаются.
Если вы все еще не знаете, что я прошу (и я извиняюсь, если это запутывает) в Jspm, когда вы создаете плагин/модуль для использования с Jspm, вы можете указать внутри package.json
для модуля что-то вроде следующее:
"jspm": {
"registry": "npm",
"jspmPackage": true,
"main": "my-module",
"format": "amd",
"directories": {
"dist": "dist/amd"
},
Я ищу эквивалент выше в TypeScript (если он существует). Директива сопоставления, поэтому, когда конечный пользователь запускает npm install my-cool-package
, а затем в своем приложении пытается что-то импортировать, все импорт по умолчанию разрешается в каталог commonjs
(в приведенном выше примере для Jspm используется amd, но такая же предпосылка).
Возможно ли это или я что-то не понимаю? Я знаю, что в новую версию добавлены новые возможности отображения маршрута, но документация по их использованию практически отсутствует.
Ответы
Ответ 1
Итак, прочитав ваш комментарий, я понял, что неправильно понял ваш вопрос! Если вы хотите управлять путями с точки зрения импортированного пакета, просто используйте свойство main
вашего package.json
для файла, который правильно представляет граф объектов вашего модуля.
{
"main": "common-utils/dist/es2015/index.js"
}
Если вы пытаетесь контролировать пути импорта с точки зрения проекта, то вы ищете TypeScript 2 новые возможности сопоставления пути для разрешения модуля. Вы можете включить отображение пути, настроив tsconfig.json
следующим образом:
{
"compilerOptions": {
"baseUrl": ".",
"paths": {
"angular2/*": ["../path/to/angular2/*"],
"local/*": ["../path/to/local/modules/*"]
}
}
}
Затем в ваших файлах TypeScript вы можете импортировать модули следующим образом:
import { bootstrap } from 'angular2/bootstrap';
import { module } from 'local/module';
Подробнее о функции сопоставления путей в TypeScript 2 см. эту проблему Github.
В вашем случае, я думаю, что следующая конфигурация должна работать:
{
"compilerOptions": {
"baseUrl": ".",
"paths": {
"common-utils/utils/*": ["./node_modules/common-utils/dist/es2015/utils/*"]
}
}
}
Ответ 2
Если вы используете пути, вам нужно изменить абсолютные пути на относительные, чтобы они работали после компиляции машинописного tsc
в простой javascript с использованием tsc
.
До сих пор самым популярным решением для этого были tsconfig-paths.
Я попробовал это, но у меня не получилось для моей сложной настройки. Кроме того, он разрешает пути во время выполнения, что означает накладные расходы с точки зрения размера вашего пакета и разрешения производительности.
Итак, я сам написал решение, tscpaths.
Я бы сказал, что лучше в целом, потому что он заменяет пути во время компиляции. Это означает, что нет зависимости во время выполнения или каких-либо накладных расходов на производительность. Это довольно просто в использовании. Вам просто нужно добавить строку в ваши скрипты сборки в package.json
.
Проект довольно молодой, поэтому могут возникнуть некоторые проблемы, если ваши настройки очень сложны. Это работает безупречно для моей установки, хотя моя установка довольно сложна.
Ответ 3
Это сбивает с толку меня, что псевдонимы не разрешаются после компиляции tsc. Построение библиотеки в tsc не работает из-за этого.