как заставить webpack загружать пакет umd библиотеки

Я пишу гибридное приложение angular1 + angular2, которое использует webpack в качестве сборщика пакетов.

В моем коде я импортирую библиотеку (@angular/upgrade) таким образом

import { UpgradeModule } from '@angular/upgrade/static';

Библиотека обновления Angular находится в папке node_module со следующей древовидной структурой (упрощенной):

@angular/upgrade
├── bundles
│   ├── upgrade-static.umd.js
│   ├── upgrade-static.umd.min.js
│   ├── upgrade.umd.js
│   └── upgrade.umd.min.js
├── index.d.ts
├── index.js
├── index.js.map
├── index.metadata.json
├── package.json
├── static
│   └── package.json
├── static.d.ts
├── static.js.map
├── static.metadata.json
└── static.js

Проблема в том, что по умолчанию веб-пакет разрешает мой оператор импорта, загружая @angular/upgrade/static.js, файл ES6, который после объединения с остальным кодом генерирует ошибки.

Вместо этого я бы хотел, чтобы веб-пакет загружал @angular/upgrade/static/package.json, который содержит правильное основное определение, указывающее на пакет umd.

{"main": "../bundles/upgrade-static.umd.js"}

Это достижимо?

Спасибо, Габ


webpack angularjs angular-upgrade
person gabric    schedule 31.12.2016    source источник

Ответы (2)


arrow_upward
1
arrow_downward

Хотя разрешение модуля описано здесь: https://webpack.github.io/docs/resolving.html должен иметь возможность делать то, что я описал выше по умолчанию, для этого мне пришлось использовать свойство resolve.alias. Вот конфигурация, которую я использовал:

resolve: {
        extensions: [ '.js', '.ts', '' ],
        modulesDirectories: [ path.resolve( __dirname, 'node_modules' ) ],
        alias: {
            '@angular/upgrade/static$': '../../node_modules/@angular/upgrade/bundles/upgrade-static.umd.js'
        }
    },
person gabric    schedule 03.01.2017

arrow_upward
0
arrow_downward

import UpgradeModule from '@angular/upgrade/bundles/upgrade-static.umd.js'; работает?

Webpack следует за main в package.json только в том случае, если package.json находится на корневом уровне модуля npm, поэтому в этом случае вам потребуется прямой доступ к нужному файлу.

person Drew Schuster    schedule 31.12.2016
comment
Привет Дрю. спасибо за ответ, но, похоже, он не работает. Я получаю ошибку Cannot find name 'UpgradeModule' во время сборки - person gabric; 03.01.2017