transformer: `define: { 'import.meta.env.*': 'undefined' }` replaces `import.meta.env.n.e.s.t.e.d` as `void 0`

[sapphi-red]

Reproduction: https://stackblitz.com/edit/github-xv4yss-8nwtaamz?file=build.mjs

define: { 'import.meta.env.*': 'undefined' } should replace import.meta.env.n.e.s.t.e.d as (void 0).e.s.t.e.d instead of void 0.

[IWANABETHATGUY]

I think it is expected to replace import.meta.env.n.e.s.t.e.d to void 0, since import.meta.env.* matched import.meta.env.n.e.s.t.e.d

[IWANABETHATGUY]

If you expect to replace import.meta.env with undefined, you should use:

define: {
    // 'import.meta.env.*': 'undefined' 
    'import.meta.env': 'undefined'
  }

instead.

[sapphi-red]

Wasn't this feature added specifically for Vite's this behavior?
https://github.com/vitejs/vite/blob/9719497adec4ad5ead21cafa19a324bb1d480194/packages/vite/src/node/plugins/define.ts#L167-L171
It works differently than that right now.

An alternative solution would be to make define: { 'import.meta.env': '{ FOO: "foo", FOO2: bar }' } replace import.meta.env.BAR with undefined (currently { FOO: "foo", FOO2: bar }.BAR is output. note that the side effect of accessing bar is intentionally avoided).

[IWANABETHATGUY]

So do you mean you want to replace import.meta.env.Bar with undefined, and replace import.meta.env to polyfill object?

https://repl.rolldown.rs/#eNp9UE1rwzAM/StCl24jmO5q2G8Y7OxL1ijF4MjBUboO4/9etU5ooR8+GMt6ek/vZezRZvTc0dHIdH4z2mvd4E7LXeQpBjIh7t/8MMYkZiBpDfHB/Lbp3fELhHaVhtBKmqk0mGIIXfxjozO939+oPuhU/coI8j8SZPhZYN+jeJWFAn2KA2zW8U1dR6DS2LuBL8iOQU9HvWeya+kWoau5D4dWv2eN44zsHDZPoBWYQeOw8LndQlmwxbHjy0XHiwulauewbodFIzmox9AKTYLlBIOkihg=

[sapphi-red]

For this input,

console.log(import.meta.env)

console.log(import.meta.env.foo)
console.log(import.meta.env.foo.toLowerCase)
console.log(import.meta.env.foo.toLowerCase())

console.log(import.meta.env.bar)
console.log(import.meta.env.bar.toLowerCase)
console.log(import.meta.env.bar.toLowerCase())

console.log(import.meta.env.other)
console.log(import.meta.env.other.toLowerCase)
console.log(import.meta.env.other.toLowerCase())

I want the output to be

console.log({
	bar: "100",
	foo: window.foo
});

console.log(window.foo);
console.log(window.foo.toLowerCase);
console.log(window.foo.toLowerCase());

console.log("100");
console.log("100".toLowerCase);
console.log("100".toLowerCase());

console.log(void 0);
console.log((void 0).toLowerCase);
console.log((void 0).toLowerCase());

I can achieve this if I know all the keys accessed (repl), but I don't know all the keys accessed.

[IWANABETHATGUY]

https://repl.rolldown.rs/#eNqVksFqwzAMhl9F+NIWgumuhp12HQx29qFZo3QBxwqO2nQEv/vkuN3GOpYmh2BJv6XP/j2qWplRNb7Cs+Y+rb0y33Gh9hLuyffkUDs6rJu2o8C6RS41+tPGeuv/qeuaSDQzCs30TAOGp7LHZer1ZpbgrQwzPUWxgOCX+g4C4necY5g0Cyhu9MIhdqEyHI4YCxXIuYoGr6VL3Rx+uPtHJfucZwB/dAgjvF5kLx03AgIR6kAtrK7bVxmQIbcxNxseYbQe5KuwbjyaFOaEvYz6Oo5VBnapzHK7RuoP261VRUqI4QYGeZE0JPOtjzvJA8TUbPrhecKWKeXRXXFUlDs4yaFcydizip/OuA7J

So for your case, you could just adding a defineOption:

 define: {

    "import.meta.env": `{
	bar: "100",
	foo: window.foo
}`,
  }

And we could implement a new feature called inline, it would try to inline the object access, if the key exists the prop would replace it with the related value, if it does not exists, replace the prop with undefined

I don't find other easy way since your requirement seems hard to deal with without dynamic information.
What do you think?

[sapphi-red]

Why cannot we make import.meta.env.* match import.meta.env.n instead of import.meta.env.n.e.s.t.e.d? That would solve the problem I have with rolldown-vite.