search

StarkShang / vite-plugin-chrome-extension

A vite plugin to bundle chrome extensions for Manifest V3.
MIT License
460 stars 68 forks source link

Any react version template update ? #14

Open hubingliang opened 3 years ago

RoeelCohen commented 2 years ago

I would love to know as well. Here's what I got so far:

I started a simple react app using vite cli. I followed with installing vite-plugin-chrome-extension and updated the plugins with react as the first plugin: plugins: [react(), chromeExtension()],

I moved the index.html file into the src folder. To make sure I'm serving the right file in dev I added root: './src', to the vite config file. (Obv. I updated the script path inside the index.html file)

in the manifest.json I added the same index.html file path as the popup page:

"action": {
    "default_popup": "index.html",
    "default_title": "Rav Safe Browsing"
  },

I also added a background file inside src folder and in the manifest:

"background": {
    "service_worker": "background.js"
  },

Overall it seems to be working? But I have few issues:

When running npm run dev I get the following errors:

Sourcemap for "/Users/roee/Repos/playground/SafeBrowsing/node_modules/.vite/react.js" points to missing source files
Sourcemap for "/Users/roee/Repos/playground/SafeBrowsing/node_modules/.vite/react_jsx-dev-runtime.js" points to missing source files
[BABEL] Note: The code generator has deoptimised the styling of /Users/roee/Repos/playground/SafeBrowsing/node_modules/.vite/react-dom.js?v=24bedd98 as it exceeds the max of 500KB.
Sourcemap for "/Users/roee/Repos/playground/SafeBrowsing/node_modules/.vite/react-dom.js" points to missing source files

I also didn't get to the options page yet so all in all it's not good enough solution and IDK if the basic standard react plugin can go hand in hand with this plugin :(