aklinker1 / vite-plugin-web-extension

Vite plugin for developing Chrome/Web Extensions
https://vite-plugin-web-extension.aklinker1.io/
MIT License
541 stars 47 forks source link

The compiled output includes `process.env` #96

Closed ListenV closed 1 year ago

ListenV commented 1 year ago

Summary

The compiled output includes process.env.

eg: background.js and content_script.js.

As far as I know, it's build in vite's Library Mode.

process.env variable not work in browser

Environment

  System:
    OS: Windows 10 10.0.22621
    CPU: (16) x64 AMD Ryzen 7 4800H with Radeon Graphics
    Memory: 3.66 GB / 15.42 GB
  Binaries:
    Node: 18.15.0 - D:\Development\Scoop\apps\nodejs-lts\current\node.EXE
    npm: 9.5.0 - D:\Development\Scoop\apps\nodejs-lts\current\npm.CMD
  Browsers:
    Edge: Spartan (44.22621.1413.0), Chromium (111.0.1661.54)
    Internet Explorer: 11.0.22621.1
  npmPackages:
    vite: ^4.2.1 => 4.2.1
    vite-plugin-web-extension: ^3.0.2 => 3.0.2
aklinker1 commented 1 year ago

I have seen this as well. It seems the build output changed since Vite 2, not surprising. I wasn't able to figure out why this happened, but library mode makes sense...

The workaround I'm currently using:

export default defineConfig({
  ...
  defines: {
    process.env: JSON.stringify({}),
  }
})

this works because, at least for me, process.env was the only value accessed on process.

I'll work on fixing the default config... Setting build.target seems like a likely fix.

aklinker1 commented 1 year ago

build.target did not effect this. Instead, I'm automatically defining process.env.NODE_ENV based on vite's mode (usually "development" or "production").

Also, according to Vite's docs, this is the only env reference output from library mode.

Screen Shot 2023-04-05 at 12 54 50 PM

See https://github.com/aklinker1/vite-plugin-web-extension/pull/98

aklinker1 commented 1 year ago

Released in v3.0.4