Как использовать Cheerio с Angular? - PullRequest
Новая
       34

Как использовать Cheerio с Angular?

0 голосов
/ 27 марта 2019

Я получаю ошибки на консоли Google Dev Tools, когда загружаю свой сайт Angular и выполняю вызов метода Cheerio load('<h2 class="title">Hello world</h2>');, как показано на странице Github.

Это совершенно новое приложение, поэтомувсе, что я сделал, это: sudo ng new myProject, sudo chmod -R 777 myProject/, sudo npm install cheerio --save, sudo npm install @types/cheerio --save.Кроме того, поскольку в прошлом я получал ошибки при компиляции TypeScript, я также запустил: sudo npm install stream --save

поверх моего app.component.ts файла, который я называю import * as cheerio from 'cheerio';, и, наконец, внутри компонента: 

ngOnInit() {
  cheerio.load('<h2 class="title">Hello world</h2>');
}

Теперь, когда я запускаю ng serve, я получаю точное сообщение об ошибке: 

inherits_browser.js:5 Uncaught TypeError: Cannot read property 'prototype' of undefined
    at inherits (inherits_browser.js:5)
    at Object../node_modules/cheerio/node_modules/parse5/lib/parser/parser_stream.js (parser_stream.js:27)
    at __webpack_require__ (bootstrap:78)
    at Object../node_modules/cheerio/node_modules/parse5/lib/index.js (index.js:41)
    at __webpack_require__ (bootstrap:78)
    at Object../node_modules/cheerio/lib/parse.js (parse.js:5)
    at __webpack_require__ (bootstrap:78)
    at Object../node_modules/cheerio/lib/cheerio.js (cheerio.js:5)
    at __webpack_require__ (bootstrap:78)
    at Object../node_modules/cheerio/index.js (index.js:5)
inherits @ inherits_browser.js:5
./node_modules/cheerio/node_modules/parse5/lib/parser/parser_stream.js @ parser_stream.js:27
__webpack_require__ @ bootstrap:78
./node_modules/cheerio/node_modules/parse5/lib/index.js @ index.js:41
__webpack_require__ @ bootstrap:78
./node_modules/cheerio/lib/parse.js @ parse.js:5
__webpack_require__ @ bootstrap:78
./node_modules/cheerio/lib/cheerio.js @ cheerio.js:5
__webpack_require__ @ bootstrap:78
./node_modules/cheerio/index.js @ index.js:5
__webpack_require__ @ bootstrap:78
./src/app/app.component.ts @ main.js:94
__webpack_require__ @ bootstrap:78
./src/app/app.module.ts @ app.component.ts:10
__webpack_require__ @ bootstrap:78
./src/main.ts @ main.ts:1
__webpack_require__ @ bootstrap:78
0 @ main.ts:12
__webpack_require__ @ bootstrap:78
checkDeferredModules @ bootstrap:45
webpackJsonpCallback @ bootstrap:32
(anonymous) @ main.js:1

Кроме того, если вы собираетесь рекомендовать вместо этого поставить import { load } from 'cheerio'; поверх файла, яЯ тоже попробовал, и появляется та же ошибка.

Это версии моих инструментов (все они самые последние или очень близкие).Angular CLI: 7.3.6 Узел: 11.12.0 ОС: darwin x64 Angular: 7.2.11

Редактировать: я пробовал решение в Добавление Cheerio.js в проект Angular 6? , и это не решило проблему, фактически добавило еще одну ошибку в консоли: 

cheerio.js:5 Uncaught ReferenceError: require is not defined
    at cheerio.js:5

1 Ответ

0 голосов
/ 27 марта 2019

Я не знаком с библиотекой cheerio. Я создал StackBlitz пример того, как заставить это работать, хотя.

Проект потребовал, чтобы я установил несколько пакетов с npm следующим образом: npm install cheerio @types/cheerio events string_decoder

Затем в app.component.ts я импортировал его с помощью: import * as cheerio from 'cheerio'; и использовал его в методе ngOnInit следующим образом: cheerio.load('<h2 class="title">Hello world</h2>').xml();

...