How to import react in background.js of chrome extension-CodePudding

I want to use reactDOM for injecting content to page. So, I want to

import React from 'react';
...
import App from './src/js/App';

const root=createRoot(document.getElementById('title'));
root.render(
   <App/>
);

included into my background.js but I get the following error: SyntaxError: Cannot use import statement outside a module

Import that is causing the error:

import React from 'react'

I've done some research and tried adding type: "module" but that does not work.

What can I do to solve this?

CodePudding user response：

Facing pretty similar issues atm, digging SO for a while.

Try to play around with

import React from './react.js'; // path and file extension here

import * as React from './react.js'; // another import option

Also, ensure you have manifest v3 in order type: "module" to work.

CodePudding user response：

After many research,

I did npm run eject

here is the working react setup