Angular - Как импортировать модуль из пакета JS

#javascript #angular #typescript #polyfills #angular-library

#javascript #angular #typescript #полизаполнения #angular-библиотека

Вопрос:

Я пытаюсь импортировать модуль из сгенерированного пакета библиотеки Angular, расположенного внутри vendor вложенной папки src/ .

index.html

 <head>
...
    <script type="text/javascript" charset="utf-8" src="./vendor/example/bundles/example.umd.js"></script>
    
</head>

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

Похоже, что @angular /core и @angular / common peerDependencies библиотеки angular также должны быть включены в скрипт для корректной работы.

Я буду признателен за любую помощь

Ответ №1:

Вы не должны добавлять <script> тег, который ссылается на локальный файл, потому что этот локальный файл не будет включен в сборку.

Вместо этого используйте раздел конфигурации скриптов angular.json файла, например:

 "scripts": [
    { "input": "src/vendor/example/bundles/example.umd.js" }
]

Это позволит встроить example.umd.js файл в выделенный файл сборки Angular. Поскольку он упакован как UMD, к нему будет прикреплен объект window , содержащий API импортируемой библиотеки.

Чтобы остановить TypeScript из-за жалобы на несуществующую переменную, просто добавьте это: declare var example; (замените example на реальное имя глобального объекта).

1. (global = global || self, factory(global.example= {}, global.ng.core, global.rxjs, global.ng2Stompjs, global.ng.common)); Ошибка воспроизводится здесь: Uncaught TypeError: не удается прочитать свойство ‘core’ неопределенного

2. Кажется, что свойства объектов ng , rxjs и ng2Stompjs глобальных undefined

3. Это означает, что для того, чтобы ваша библиотека работала, необходимо импортировать некоторые зависимости. Вы уверены, что example это не библиотека Angular, которую следует импортировать в один из ваших модулей Angular?

4. Ну, вам не следует пытаться импортировать эту библиотеку как UMD, а как ESM с файлами определения TypeScript. В идеале, если эта библиотека находится в NPM, установите ее с npm i example

5. Это угловой модуль? Доступен ли он как пакет ESM (не UMD)?