create-chrome-ext icon indicating copy to clipboard operation
create-chrome-ext copied to clipboard

Unable to load jquery.js file under content script directory

Open Kain-90 opened this issue 1 year ago • 4 comments

Everything is fine during the dev mode, but after run yarn build and reload the extension, the dev console shows the error: image

I can find jquery.js in the Sources tab, and $ can be successfully called in the dev console image

manifest.ts content like below

  content_scripts: [
    {
      matches: omit,
      js: [
        'src/contentScript/jquery.js',
        'src/contentScript/index.ts',
      ],
      css: omit,
      run_at: 'document_start',
    },
  ],

Kain-90 avatar Mar 16 '24 12:03 Kain-90

Try importing jQuery directly in your index.ts

Install jQuery

yarn add jquery

index.ts

import $ from "jquery";

sakibul-islam avatar Mar 17 '24 08:03 sakibul-islam

Try importing jQuery directly in your index.ts

Install jQuery

yarn add jquery

index.ts

import $ from "jquery";

Thank you for your advice. I haven't tested it yet, because jquery.js is just one example. If otherA.js contains a function A and otherB.js contains a function B, how should I call these methods A and B in index.ts?

Kain-90 avatar Mar 17 '24 12:03 Kain-90

Try importing jQuery directly in your index.ts

Install jQuery

yarn add jquery

index.ts

import $ from "jquery";

Thank you for your advice. I haven't tested it yet, because jquery.js is just one example. If otherA.js contains a function A and otherB.js contains a function B, how should I call these methods A and B in index.ts?

Check Modules documentation:

sakibul-islam avatar Mar 18 '24 07:03 sakibul-islam