Как преобразовать синтаксис импорта модуля typcript npm в синтаксис импорта модуля ECMA2015 - PullRequest
Новая
       42

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

0 голосов
/ 23 мая 2018

Я пытаюсь использовать стороннюю библиотеку в проекте 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'?

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

1 Ответ

0 голосов
/ 06 июня 2018

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

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

import { somedependency } from my-dependency (где my-dependency - это модуль узла, такой как three.)

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

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

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

...