wxt-dev / wxt-dev/wxt

.env contents not replaced during dev in chrome

Open
#1,802 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

pending-triage
Dominant language
TypeScript
Stars
10.5k
Forks
564
PR merge metrics
No merged PRs in 30d

Description

Describe the bug

Hey there! I appreciate all the work you've done on WXT.

I have a slightly unique issue, but it's due to what I assume is an overlooked case.

I use a custom profile for chrome, so it may have to do with that.

The issue I'm facing has to do with the fact that if you change a .env file, it does not get reloaded:

  1. During hot reload (that's fine, to be expected)
  2. After restarting the project (that's what's surprising to me).

After doing some research, what I've found is that the .env file contents are directly replaced and embedded statically in code, which is why this is surprising, since I assume the changes should be detected as the string itself changes.

Another idea that I could be totally wrong about is how you actually diff the contents of what's in chrome versus development files. I checked, and saw that the uploaded files (console logged) do not change their contents unless removing the chrome extension manually, or starting in a new profile.

This leads me to believe this has nothing to do with how vite handles replacing the code, but how the changes are detected and uploaded in the extension itself.

I'll include a minimally reproducible example.

Some current workarounds I've found is just manually removing the extension from the profile, and then running dev again.

Reproduction

https://github.com/WTPieh/wxt-env-test

Steps to reproduce

How To Test

  1. npm install.

  2. In order to test the effect I'm running into, you must first run the project with the default url I have in the .env.
    npm run dev

  3. In the popup, click on the button. You should get something like delectus etc.

  4. Change the .env value to the one I have in a comment. I chose two different JSON placeholders to ensure they have the same value to show how the caching happens.

  5. Ctrl + C to end the project.

  6. Then run the project again, and click on the button. You'll see that the message is the same.

Look at the console logs to see that output is the same, showing the old .env file is not being replaced.

System Info
Need to install the following packages:
envinfo@7.14.0
Ok to proceed? (y) y


  System:
    OS: macOS 26.0
    CPU: (14) arm64 Apple M4 Pro
    Memory: 585.64 MB / 48.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 24.2.0 - ~/.nvm/versions/node/v24.2.0/bin/node
    npm: 11.3.0 - ~/.nvm/versions/node/v24.2.0/bin/npm
    pnpm: 10.12.1 - /opt/homebrew/bin/pnpm
  Browsers:
    Chrome: 138.0.7204.101
    Safari: 26.0
  npmPackages:
    wxt: ^0.20.6 => 0.20.7
Used Package Manager

npm

Validations

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with the linked minimal reproduction, run npm install and npm run dev, then repeat the .env change and restart steps while comparing the generated output and Chrome extension contents. Trace the development reload, change-detection, and upload path; done means a changed .env value is reflected after restarting without manually removing the extension.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
build-system, devtools
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
48/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.