Do you use NPM modules in your extension? How?

yup I import a few packages including React.js .

What you want is a "bundler", it's a tool that frontend devs use to get their code ready to ship in a browser. The bundler compiles and bundles all your scripts into a single generated "dist" JS file. Then you put that dist JS into your extension bundle, and that file is your extension's content script or background script.

ESBuild is a good choice for this (there's other choices like Webpack, Parcel, etc). Here's my ESBuild script:

require('esbuild').build({
    entryPoints: [
        'src/extension/contentMain.ts',
        'src/extension/backgroundMain.ts',
        'src/extension/popupMain.tsx',
    ],
    sourcemap: 'external',
    bundle: true,
    platform: 'browser',
    outdir: 'chrome-extension/dist',

})
.catch(err => {
    console.log(err.stack || err);
});