0

I am trying to build a simple Chrome extension that utilizes a few JS libraries. The directory structure is as follows:

cheerio(folder downloaded with npm)
axios.min.js
jquery.min.js
popup.html
test.js

As you can see, two of the three libraries I was able to locate a .min file for. However, Cheerio does not appear to have one, so I am trying to figure out how to get it to load in my extension.

I have tried to configure my popup.html as such, which does not work:

<html>
    <script src="jquery.min.js"></script>
    <script type="module" src="cheerio"></script>
    <script src="axios.min.js"></script>
    <body>
        <h1>Header</h1>
    </body>
    <script src="test.js" type="module"></script>
</html>

And when I try to import cheerio from 'cheerio', I get a type error.

I am not using a content or background script in my manifest.json, just the action.default_popup.

Can I use web pack as a solution? Is there another way?

Connor
  • 9
  • 1
  • 1
    What's the point of using cheerio in the browser? The purpose of cheerio is to port jQuery to Node.js, the backend server, so if you're in the browser you have the real deal: the DOM and jQuery, and you don't need to imitate it. "I get a type error." -- which one? Probably `require is not defined`. – ggorlen Jan 04 '23 at 23:23
  • I was intending on using cheerio to parse html that I had scraped from a different webpage, so it could be viewable whenever my extension is clicked. And yes, that require us not defined. – Connor Jan 04 '23 at 23:35
  • Were you aware that the DOM has a built-in HTML parser, plus jQuery? – ggorlen Jan 04 '23 at 23:38
  • That is new to me. Getting started with JavaScript here. Will have to do some reading - thanks! – Connor Jan 04 '23 at 23:40

0 Answers0