Библиотека Angular не может включать в комплект сторонние библиотеки.

Мое требование состоит в том, чтобы создавать библиотеки, которые имеют собственное представление, и в соответствии с конфигурацией пользователя библиотека будет извлечена из корзины AWS S3 и включена в окончательное приложение во время выполнения. см. этот пример. Я могу добавить dist/library/bundles/library.lib.umd.js в основное приложение и показать его пользователю. Но когда я пытаюсь использовать сторонние библиотеки, такие как uuid, moment или ng2-dragula, команда ng build не включает сторонние библиотеки в окончательный пакет. Я получаю предупреждение, как

'ng2-dragula' is imported by ..\..\dist\torab-custom-lib\esm5\lib\custom-lib.service.js, but could not be resolved – treating it as an external dependency

при создании библиотеки и моего приложения, в котором существует projects/library, показано

ERROR in dist/torab-custom-lib/lib/custom-lib.component.d.ts(2,32): error TS2307: Cannot find module 'ng2-dragula

Я хочу включить любую стороннюю библиотеку, которую я использую, в окончательный пакет, поскольку я не могу установить/импортировать их во время выполнения. я пытался

"bundledDependencies": [
    "ng2-dragula"
  ]

в package.json, как предложено здесь и

"embedded": [
    "ng2-dragula"
      ],

в моем ng-package.json предложено здесь. Это информация о моей среде

Angular CLI: 7.1.4
Node: 11.10.0
OS: win32 x64
Angular: 7.1.4
... animations, cli, common, compiler, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router

Package                            Version
------------------------------------------------------------
@angular-devkit/architect          0.11.4
@angular-devkit/build-angular      0.13.5
@angular-devkit/build-ng-packagr   0.11.4
@angular-devkit/build-optimizer    0.13.5
@angular-devkit/build-webpack      0.13.5
@angular-devkit/core               7.1.4
@angular-devkit/schematics         7.1.4
@angular/compiler-cli              7.2.9
@ngtools/json-schema               1.1.0
@ngtools/webpack                   7.3.5
@schematics/angular                7.1.4
@schematics/update                 0.11.4
ng-packagr                         4.7.1
rxjs                               6.3.3
typescript                         3.1.6
webpack                            4.29.0

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


person Torab Shaikh    schedule 14.03.2019    source источник
comment
Я думаю, вам нужно использовать npm pack и npm publish из bundledDependencies. Это то, что предлагают документы ng-packgr   -  person Drenai    schedule 21.10.2019


Ответы (1)


После создания библиотеки используйте rollupjs для объединения сторонних библиотек из файла fesm5.

Вот мой rollup.config:

import resolve from 'rollup-plugin-node-resolve';
import sourcemaps from 'rollup-plugin-sourcemaps';
import commonjs from 'rollup-plugin-commonjs';

export default {
    plugins: [
       resolve(), 
       sourcemaps(),
       commonjs({
        namedExports: { 
            'node_modules/chart.js/dist/Chart.js': ['Chart' ]
        }
      })
   ],
   onwarn: () => { return },
   output: {
       format: 'umd',
       name: 'mylib',
       globals: globals,
       sourcemap: true,
       amd: { id: 'mylib' }
    }
}

Затем я использую эту команду свертки:

 rollup -c rollup.config.js -i .\dist\mylib\fesm5\mylib.js -o .\dist\mylibwiththirdparty.umd.js
person Nicolas Law-Dune    schedule 02.05.2019