Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

fix: don't replace NODE_ENV in vite:client-inject #6935

Merged
merged 5 commits into from Feb 18, 2022
Merged

fix: don't replace NODE_ENV in vite:client-inject #6935

Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
85b924c
fix: don't replace NODE_ENV in vite:client-inject
patak-dev Feb 15, 2022
37bff17
chore: checking CI
patak-dev Feb 15, 2022
56ed808
chore: revert test
patak-dev Feb 15, 2022
fa7e458
fix: inject process.env.NODE_ENV in client
patak-dev Feb 17, 2022
3520058
chore: merge
patak-dev Feb 17, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
13 changes: 6 additions & 7 deletions packages/vite/src/node/plugins/clientInjections.ts
View file
Open in desktop
Expand Up @@ -40,21 +40,20 @@ export function clientInjectionsPlugin(config: ResolvedConfig): Plugin {
port = path.posix.normalize(`${port}${hmrBase}`)
}

const defines = {
'process.env.NODE_ENV': JSON.stringify(config.mode),
...(config.define || {})
}

return code
.replace(`__MODE__`, JSON.stringify(config.mode))
.replace(`__BASE__`, JSON.stringify(config.base))
.replace(`__DEFINES__`, serializeDefine(config.define || {}))
.replace(`__DEFINES__`, serializeDefine(defines))
.replace(`__HMR_PROTOCOL__`, JSON.stringify(protocol))
.replace(`__HMR_HOSTNAME__`, JSON.stringify(host))
.replace(`__HMR_PORT__`, JSON.stringify(port))
.replace(`__HMR_TIMEOUT__`, JSON.stringify(timeout))
.replace(`__HMR_ENABLE_OVERLAY__`, JSON.stringify(overlay))
} else if (code.includes('process.env.NODE_ENV')) {
// replace process.env.NODE_ENV
return code.replace(
/\bprocess\.env\.NODE_ENV\b/g,
JSON.stringify(config.mode)
)
}
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@bluwy I saw you did a PR before touching NODE_ENV replacement. Do you know why this branch is needed? Looks to me (as suggested by @sheremet-va) that the replacement done in the DefinePlugin should already take care of process.env.NODE_ENV. Why is this also being replaced here?

Copy link
Contributor

@vursen vursen Feb 16, 2022 •
edited

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I ran into this a couple of days ago when I wanted to configure some env variables for a service worker. It turned out that DefinePlugin only takes place for the production build and the server build (when SSR is enabled).

vite/packages/vite/src/node/plugins/define.ts

Lines 84 to 89 in 3f27d58

const ssr = options?.ssr === true
if (!ssr && !isBuild) {
// for dev we inject actual global defines in the vite client to
// avoid the transform cost.
return
}

As for the development build, it seems to be vite/env.ts that is supposed to define env variables. And it does it at runtime.

For all that, I expected that importing vite/env.ts would define process.env.NODE_ENV. However, the reality was that it gets replaced by this workaround.

So I would be interested in listening to why it was decided to keep this workaround instead of defining all the variables in vite/env.ts at runtime (in dev mode).

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yeah this look superfluous. The define plugin currently doesn't handle this case though since it bails out and relied on a global globalThis.process.env.NODE_ENV = "env" call for performance.

vite/packages/vite/src/node/plugins/define.ts

Lines 85 to 88 in 56ed808

if (!ssr && !isBuild) {
// for dev we inject actual global defines in the vite client to
// avoid the transform cost.
return

But it looks like currently we don't do a globalThis.process.env.NODE_ENV = "env" call anywhere, which causes the CI to fail. It should be fixable though if we add process.env.NODE_ENV to the __DEFINES__:

vite/packages/vite/src/node/plugins/clientInjections.ts

Line 46 in 3f27d58

.replace(`__DEFINES__`, serializeDefine(config.define || {}))

The current code now looks like a quick way to get it working before, which causes the Vitest issue since it doesn't handle preventAssignment cases.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

So instead of having processNodeEnv in https://github.com/vitejs/vite/blob/main/packages/vite/src/node/plugins/define.ts#L10
we should move it to the the place where Vite resolves config?

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm thinking of directly adding it in client injection fa7e458

}
}
Expand Down