Угловой AOT/Rollup с модулями, которые не имеют экспорта по умолчанию (например, immutable.js, moment.js)

Question

Я пытаюсь настроить мое угловое приложение, чтобы быть готовым к компиляции AOT и встряхиванию дерева (сведение). Но у меня проблемы с использованием модулей, которые не имеют экспорта по умолчанию (immutable.js, moment.js,...). Согласно Typscript (смотрите здесь) такие модули можно использовать только со следующим утверждением: import x = require('x')или же import * as x from 'x'Но оба заявления вызывают проблемы во время свертывания. В некоторых случаях я получаю сообщение об ошибке во время накопительного пакета: Cannot call a namespace ('x') и в некоторых случаях я получаю ошибку времени выполнения, которая: x is undefined

Здесь вы найдете мои rollup-config.js и tsconfig-aot.json tsconfig-aot_rollup-config.zip

Мне нужен способ использовать пакеты, такие как immutable.js, moment.js, во время компиляции AOT и накопительного пакета. Есть ли способ сделать это?

Спасибо!

Answer 1

ОБНОВИТЬ

Я столкнулся с проблемой с моим предыдущим ответом. Вот решение, к которому я пришел, которое работает как в SystemJ, так и с использованием AoT/rollup.

Мое утверждение импорта следующее:

import * as moment from 'moment';
const momentJs = (moment as any).default ? (moment as any).default : moment;

затем, в вашем коде, используйте это так:

const startDateString = momentJs(startDate).format('YYYY-MM-DD');

Это связано с тем, что SystemJ и Rollup используют два разных метода для разрешения импорта модулей, которые не имеют экспорта по умолчанию.

У меня есть два файла TypeScript Config, один для systemJ и один для запуска сборки AoT. У них обоих установлен этот флаг в compilerOptions

"allowSyntheticDefaultImports": true

---

(предыдущий ответ)

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

var moment = require('moment'); //works

в отличие от

import moment from "moment"; // won't work

или же

import moment = require('moment'); //won't work

в моем конфиге накопления у меня также есть:

commonjs({
        include: [
            'node_modules/rxjs/**', 
            'node_modules/moment/**', 
            'node_modules/hammerjs/**'
        ]
    }),

То, что указывало мне правильное направление, было таким НАСТОЯЩИМ ответом на аналогичный вопрос.

Вышеупомянутое решение работает как с SystemJ, так и с процессом AoT/Rollup для Angular. Он выглядит немного хакерским, поскольку это не "типичный" машинописный способ импорта модулей, но он помог мне решить эту проблему.

Answer 2

Я обнаружил, что в rollup-config.js, в кулинарной книге ts, они специально поместили rxjs в файл commonJs include. Если вы переключитесь с включения только rxjs, он также будет работать со сторонними модулями.

Например, я использую angular2-materialize, поэтому:

commonjs({
  include: [
    'node_modules/rxjs/**',
    'node_modules/angular2-materialize/**'
  ],

или просто включите все (нашел лучше, протестировал build.js, того же размера):

commonjs({
  include: 'node_modules/**'
})

Answer 3

Rollup работает только с es6. Попробуйте изменить цель в вашем tsconfig:

"target": "es6"

Когда сворачивание закончится, вы можете скомпилировать пакет с машинописью в es5 с опцией allowJs: true.

ps require - это Webpack-способ, при котором Rollup использует синтаксис импорта es6.