Как преобразовать синтаксис импорта модуля npm машинописного текста в синтаксис импорта модуля ECMA2015

Я пытаюсь использовать стороннюю библиотеку в проекте Typescript (в частности, три). В качестве доказательства концепции я пытаюсь разрешить весь свой клиентский код как модули (без переноса на ES5 или объединения).

мой проект настроен так:

cgi/app.js (compiled typescript file)
node_modules/@types
node_modules/three/build/three.module.js
src/app.ts
index.html
tsconfig.json
package.json

И в моем index.html

<head>
    <script type="module" src="node_modules/three/build/three.module.js"></script>
    <script type="module" src="cgi/app.js"></script>
</head>

Я пытаюсь заставить машинописный текст разрешить файл three.module.js, одновременно используя объявления типа из @types/three. Обычно вы импортируете библиотеку с помощью: import { Scene } from 'three', что дает мне поддержку типов, но у скомпилированного модуля нет надлежащего синтаксиса ES6. Это должно быть import { Scene } from './path/to/three.js.

К сожалению, машинописный текст пока не поддерживает выполнение этого автоматически. Вместо этого я могу напрямую импортировать модуль ES6 (без использования @types), но тогда я теряю поддержку типов.

Компиляция пост-машинописного текста, возможно ли преобразовать разрешение модуля из синтаксиса узла в синтаксис ES6? (например, import { Scene } from 'three' преобразуется в import { Scene } from './three.js'?

В частности, можно ли для этого использовать накопительный пакет?


typescript typescript-typings es6-modules rollupjs
person Nathan Lafferty    schedule 23.05.2018    source источник

Ответы (1)


arrow_upward
1
arrow_downward

Это можно сделать с помощью значения конфигурации paths Rollup.

Например. в моем app.ts файле у меня есть стандартный импорт в стиле npm:

import { somedependency } from my-dependency (где my-dependency - модуль узла, например three.)

В файле rollup.config вам необходимо указать Rollup путь к этому файлу:

output: { ... },
plugins: [ ... ]
paths: {'my-dependency': './your/web/path/to/the/dependency.js'}

Теперь у вашего скомпилированного пакета будет хороший импорт в этот код, который может быть понят браузером.

person Nathan Lafferty    schedule 05.06.2018