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.

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

feat(taro-plugin-vue3): sfc template conditional compilation #11482

Open
wants to merge 1 commit into
base: 3.x
Choose a base branch
from

Conversation

b2nil
Copy link
Collaborator

@b2nil b2nil commented Mar 19, 2022

这个 PR 做了什么? (简要描述所做更改)
使用 vue 3.0 单文件组件模板语法时,无法通过 v-if 判断 process.env.TARO_ENV 来时实现条件编译。
例如,<view v-if="process.env.TARO_ENV==='weapp'"/> 会被编译为:

_ctx.process.env.TARO_ENV==='weapp' 
   ? createElementBlock('view')
   : createCommentBlock('v-if', true)

这并不能删除不相关平台的代码。

本 PR 引入了一个编译时 tag 属性 taro-envtaroEnv, 其取值应与 process.env.TARO_ENV 完全一致。
@vue/sfc-compiler 对模板进行编译的过程中,通过比较 taro-envprocess.env.TARO_ENV 的值来删除无关平台的节点, 从而实现 vue3 模板的条件编译。

用法

<view taro-env="weapp">weapp 平台节点</view>
<view taro-env="h5">h5 平台节点</view>
  • 使用 yarn dev:weapp 编译后的结果为:<view>weapp 平台节点</view>
  • 使用 yarn dev:h5 编译后的结果为:<view>h5 平台节点</view>

此外本 PR 还将 h5 平台和小程序平台用到的 nodeTransform 函数都放到了一个文件里面。

这个 PR 是什么类型? (至少选择一个)

这个 PR 涉及以下平台:

  • 所有小程序
  • Web 平台(H5)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
V-3 Version - 3.x
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants