vuejs/rfcs

Compiler: whitelist `import` global in template

Akryum opened this issue · 2 comments

What problem does this feature solve?

It would allow to put for example import.meta.env.DEV inside the template to remove render code when building.

<template>
	<DevOnlyButton v-if="import.meta.env.DEV" />
</template>

What does the proposed API look like?

Add import here:
https://github.com/vuejs/core/blob/78b86150b801e7eb4ebf1cdff977e791dc0438f0/packages/shared/src/globalsWhitelist.ts#L3

Alternative proposal: allow customizing the whitelist

I guess sourceType: 'module' needs to be set here.
https://github.com/vuejs/core/blob/fe77e2bddaa5930ad37a43fe8e6254ddb0f9c2d7/packages/compiler-core/src/transforms/transformExpression.ts#L250-L252
But I'm not sure whether this is safe to change. I guess 012 will throw a syntax error is that is set (because strict mode is enabled in ESM).