vuejs / rfcs

RFCs for substantial changes / feature additions to Vue core
4.87k stars 548 forks source link

Compiler: whitelist `import` global in template #566

Closed Akryum closed 1 year ago

Akryum commented 1 year ago

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

Akryum commented 1 year ago

Alternative proposal: allow customizing the whitelist

sapphi-red commented 1 year ago

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).