Подтвердить что ты не робот

Новый синтаксис es6 для импорта модулей commonjs/amd, т.е. `Import foo = require ('foo')`

Раньше я мог делать:

import foo = require('foo');

Но теперь, когда TypeScript (1.5) поддерживает синтаксис модуля es6, каков правильный путь к тому же в синтаксисе модуля ES6.

4b9b3361

Ответ 1

Правильный способ - использовать старый синтаксис импорта. Новый синтаксис импорта предназначен только для модулей ES, старый синтаксис импорта предназначен для модулей pre-ES6. Эти два являются намеренными. import * as foo from 'foo' импортирует все свойства модуля 'foo', он не импортирует значение по умолчанию как foo.

От разработчика функции:

  • В объявлении экспорта по умолчанию всегда объявляется экспортированный член с именем по умолчанию и всегда выдается как назначение export.default. Другими словами, export default последовательно имеет семантику ES-модуля. Для совместимости с Babel мы могли бы при необходимости генерировать маркер __esModule, когда модуль имеет экспорт по умолчанию, но мы бы не использовали этот маркер для чего-либо.
  • Объявление export =, которое заменяет другой объект, который будет экспортироваться вместо самого модуля, всегда испускается как назначение module.exports. Ошибочно иметь другой экспорт в модуле, который использует export =. Это существующее поведение TypeScript.
  • Модуль, который использует export = для экспорта другого модуля (будь то внутренний или внешний модуль), может быть импортирован с использованием новых конструкций ES6. В частности, с такими модулями можно использовать удобный импорт деструктуризации. Шаблон использования export = для экспорта другого модуля распространен в файлах .d.ts, которые предоставляют представление CommonJS/AMD внутреннего модуля (например, angular.d.ts).
  • Модуль, который использует export = для экспорта немодульной сущности вместо самого модуля, должен быть импортирован с использованием существующего синтаксиса import x = require("foo"), как сегодня.

Обновление 2016: Компилятор TypeScript в какой-то момент начал разрешать import * as foo from 'legacy-module-foo' получать по умолчанию импорт устаревшего модуля в определенных обстоятельствах. Это нарушение спецификации ES6 (§15.2.1.16, "Значение" * "означает, что импорт запрос предназначен для целевых модулей объект пространства имен.").

Когда устаревшие модули, импортируемые таким образом, обновляются в модулях ES6, импорт по умолчанию для этих модулей перестанет работать (поскольку * as foo импорт должен импортировать объекты пространства имен), что может быть очень запутанным, если вы не знаю, что это взлом TypeScript/SystemJS. Возможно также, что последующая перестройка TypeScript спецификации ES приведет к их разрыву.

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

Ответ 2

Соответствующий синтаксис синтаксиса модуля ES6:

import * as foo from 'foo';

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

Ответ 3

Модули ES6 эффективно TypeScript с новыми модулями с новым синтаксис: модули ES6 отдельно загружают исходные файлы, которые, возможно, импортировать другие модули и предоставить ряд внешних доступных экспорт. Модули ES6 имеют несколько новых экспортных и импортных деклараций. Рекомендуется, чтобы библиотеки TypeScript и приложения будут обновлены, чтобы использовать новый синтаксис, но это не требование.

Источник

Насколько я понимаю, это означает, что вам рекомендуется перенести свои собственные модули TypeScript в новый синтаксис, но продолжайте использовать import foo = require('foo') для импорта реальных модулей AMD/CommonJS.

Ответ 4

Начиная с TypeScript 2.7, появился новый флаг esModuleInterop который можно использовать для включения импорта по умолчанию с CommonJS/AMD/UMD. Установив для этого флага значение true в вашем tsconfig.json, это должно работать как положено:

import foo from 'foo';

Ответ 5

Другой вариант - импортировать его с использованием синтаксиса commonjs:

const foo = require("foo");

TypeScript и Bable согласны с тем, что с этим делать. Кроме того, если вы все равно компилируете до ES5 или менее, это не будет слишком далеко от его окончательной формы.

Ответ 6

импортировать все,

const foo = require("foo");

это импортирует весь экземпляр из пакета "foo", если это файл, то

const foo = require("./foo");

так что вы можете получить доступ к каждому экземпляру, вызвав, foo.InstanceName

если вы хотите импортировать конкретный экземпляр,

import MyInstance from "foo";

так что это импортирует конкретный экземпляр (Myinstance) из "foo", который вы все равно можете импортировать, используя вышеописанный метод,

import * as ReferenceName from "foo";

это эквивалентно,

const ReferenceName = require("foo");