feat: 添加 useXsForTemplate 试用性字段以及半编译预处理功能 (#16598)

* feat: init

* feat: 完成模块拆分与基本工作流

* feat: 完成组件收集

* feat: 完成收集环节和转化环节的串联

* feat: 完成react组件中render组件的搜集

* feat: 拓扑算法输出依赖顺序

* chore(release): publish 4.0.6-alpha.0 --tag=alpha

* feat: 暂时保存

* feat: 补齐绝大部份测试用例

* lint: 使用rustfmt 统一代码风格

* style: 优化目录结构

* feat: 完善测试用例

* ci: 添加新的swc插件编译命令

* feat: 接入半编译预处理 swc 插件

* chore(debug): 增加快捷调试脚本&解决husky不工作问题

* perf(setData): 优先使用微任务执行setData

* perf(wxs): 增加模版渲染时是否使用wxs配置(不使用wxs性能可提升10%以上)

* perf(event): 增加clickview模版,减少冗余事件绑定

* perf(template): 移除模版中用于循环体的block标签,降低节点嵌套和模版大小

* chore(release): publish 4.0.7-alpha.1 --tag=alpha

* test: 更新snapshots

* perf(setData): 修复不使用wxs时custom-wrapper组件l属性为null导致的warning问题

* feat: 半编译支持没有xs的情况

* lint: fix

* feat: 更新半编译swc

* chore(release): publish 4.0.7-alpha.2 --tag=alpha

* chore: 解决合并冲突

* chore: 解决合并冲突

* feat: 设置半编译预处理config

---------

Co-authored-by: yushijie1 <yushijie1@jd.com>

.cargo/config.toml

@@ -20,5 +20,5 @@ rustflags = ["-C", "target-feature=+crt-static"]
 # Alias to build actual SWC plugin binary for the specified target.
 build-wasi = "build --target wasm32-wasi"
 build-wasm32 = "build --target wasm32-unknown-unknown"
-build-swc-plugins = "build-wasi --release -p swc_plugin_compile_mode -p swc_plugin_define_config"
-test-swc-plugins = "test -p swc_plugin_compile_mode -p swc_plugin_define_config"
+build-swc-plugins = "build-wasi --release -p swc_plugin_compile_mode -p swc_plugin_define_config -p swc_plugin_compile_mode_pre_process"
+test-swc-plugins = "test -p swc_plugin_compile_mode -p swc_plugin_define_config -p swc_plugin_compile_mode_pre_process"

.vscode/settings.json

@@ -18,7 +18,8 @@
     "./crates/taro_init/Cargo.toml",
     "./crates/native_binding/Cargo.toml",
     "./crates/swc_plugin_compile_mode/Cargo.toml",
-    "./crates/swc_plugin_define_config/Cargo.toml"
+    "./crates/swc_plugin_define_config/Cargo.toml",
+    "./crates/swc_plugin_compile_mode_pre_process/Cargo.toml"
   ],
   "rust-analyzer.showUnlinkedFileNotification": false
 }

crates/native_binding/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tarojs/binding",
-  "version": "4.0.6",
+  "version": "4.0.7-alpha.2",
   "description": "Node binding for taro",
   "main": "binding.js",
   "typings": "binding.d.ts",

crates/swc_plugin_compile_mode/src/lib.rs

@@ -1,54 +1,60 @@
+use serde::Deserialize;
+use std::collections::HashMap;
 use swc_core::{
-    ecma::{
-        ast::Program,
-        visit::{as_folder, FoldWith, VisitMut},
-    },
-    plugin::{
-        plugin_transform,
-        proxies::TransformPluginProgramMetadata
-    }
+  ecma::{
+    ast::Program,
+    visit::{as_folder, FoldWith, VisitMut},
+  },
+  plugin::{plugin_transform, proxies::TransformPluginProgramMetadata},
 };
-use serde::{Deserialize};
-use std::collections::HashMap;
 
-mod utils;
-mod transform;
-mod transform_harmony;
 #[cfg(test)]
 mod tests;
+mod transform;
+mod transform_harmony;
+mod utils;
 
 struct SerdeDefault;
 impl SerdeDefault {
-    fn platform_default () -> String {
-        String::from("WEAPP")
-    }
+  fn platform_default() -> String {
+    String::from("WEAPP")
+  }
+  fn is_use_xs_default() -> bool {
+    true
+  }
+  fn template_tag_default() -> String {
+    String::from("")
+  }
 }
 
-#[derive(Deserialize,  Debug)]
+#[derive(Deserialize, Debug)]
 pub struct ComponentReplace {
-    pub current_init: String,
-    pub dependency_define: String,
+  pub current_init: String,
+  pub dependency_define: String,
 }
 #[derive(Deserialize, Debug)]
 pub struct PluginConfig {
-    pub tmpl_prefix: String,
-    #[serde(default = "SerdeDefault::platform_default")]
-    pub platform: String,
-    #[serde(default)]
-    pub is_harmony: bool,
-    #[serde(default)]
-    pub components: HashMap<String, HashMap<String, String>>,
-    #[serde(default)]
-    pub adapter: HashMap<String, String>,
-    #[serde(default)]
-    pub support_events: Vec<String>,
-    #[serde(default)]
-    pub support_components: Vec<String>,
-    #[serde(default)]
-    pub event_adapter: HashMap<String, String>,
-    #[serde(default)]
-    pub component_replace: HashMap<String, ComponentReplace>,
-
+  pub tmpl_prefix: String,
+  #[serde(default = "SerdeDefault::platform_default")]
+  pub platform: String,
+  #[serde(default)]
+  pub is_harmony: bool,
+  #[serde(default)]
+  pub components: HashMap<String, HashMap<String, String>>,
+  #[serde(default)]
+  pub adapter: HashMap<String, String>,
+  #[serde(default)]
+  pub support_events: Vec<String>,
+  #[serde(default)]
+  pub support_components: Vec<String>,
+  #[serde(default)]
+  pub event_adapter: HashMap<String, String>,
+  #[serde(default)]
+  pub component_replace: HashMap<String, ComponentReplace>,
+  #[serde(default = "SerdeDefault::is_use_xs_default")]
+  pub is_use_xs: bool,
+  #[serde(default = "SerdeDefault::template_tag_default")]
+  pub template_tag: String,
 }
 
 /// An example plugin function with macro support.
@@ -68,19 +74,15 @@ pub struct PluginConfig {
 /// Refer swc_plugin_macro to see how does it work internally.
 #[plugin_transform]
 pub fn process_transform(program: Program, metadata: TransformPluginProgramMetadata) -> Program {
-    let config = serde_json::from_str::<PluginConfig>(
-        &metadata
-            .get_transform_plugin_config()
-            .unwrap()
-    )
-    .unwrap();
+  let config =
+    serde_json::from_str::<PluginConfig>(&metadata.get_transform_plugin_config().unwrap()).unwrap();
 
-    // 如果 config 中的 is_harmony 字段为 true 则走 harmony_transform, 否则则走 transform
-    let visitor: Box<dyn VisitMut> = if config.is_harmony {
-        Box::new(transform_harmony::TransformVisitor::new(config))
-    } else {
-        Box::new(transform::TransformVisitor::new(config))
-    };
+  // 如果 config 中的 is_harmony 字段为 true 则走 harmony_transform, 否则则走 transform
+  let visitor: Box<dyn VisitMut> = if config.is_harmony {
+    Box::new(transform_harmony::TransformVisitor::new(config))
+  } else {
+    Box::new(transform::TransformVisitor::new(config))
+  };
 
-    program.fold_with(&mut as_folder(visitor))
+  program.fold_with(&mut as_folder(visitor))
 }

crates/swc_plugin_compile_mode/src/tests/attributes.rs

@@ -1,11 +1,11 @@
+use super::{get_syntax_config, tr};
 use swc_core::ecma::transforms::testing::test;
-use super::{tr, get_syntax_config};
 
 test!(
-    get_syntax_config(),
-    |_| tr(),
-    should_keep_static_attrs_only_in_templates,
-    r#"
+  get_syntax_config(),
+  |_| tr(),
+  should_keep_static_attrs_only_in_templates,
+  r#"
     function Index () {
         return (
           <View compileMode>
@@ -17,10 +17,10 @@ test!(
 );
 
 test!(
-    get_syntax_config(),
-    |_| tr(),
-    should_turn_dynamic_attrs,
-    r#"
+  get_syntax_config(),
+  |_| tr(),
+  should_turn_dynamic_attrs,
+  r#"
     function Index () {
         return (
           <View compileMode>
@@ -37,10 +37,10 @@ test!(
 );
 
 test!(
-    get_syntax_config(),
-    |_| tr(),
-    should_handle_events,
-    r#"
+  get_syntax_config(),
+  |_| tr(),
+  should_handle_events,
+  r#"
     function Index () {
         return (
           <View compileMode>

crates/swc_plugin_compile_mode/src/tests/children.rs

@@ -1,11 +1,11 @@
+use super::{get_syntax_config, tr};
 use swc_core::ecma::transforms::testing::test;
-use super::{tr, get_syntax_config};
 
 test!(
-    get_syntax_config(),
-    |_| tr(),
-    should_support_render_fn,
-    r#"
+  get_syntax_config(),
+  |_| tr(),
+  should_support_render_fn,
+  r#"
     function Index () {
         return (
           <View compileMode>
@@ -19,10 +19,10 @@ test!(
 );
 
 test!(
-    get_syntax_config(),
-    |_| tr(),
-    should_support_fragment,
-    r#"
+  get_syntax_config(),
+  |_| tr(),
+  should_support_fragment,
+  r#"
     function Index () {
         return (
           <View compileMode>
@@ -54,10 +54,10 @@ test!(
 );
 
 test!(
-    get_syntax_config(),
-    |_| tr(),
-    should_support_context_api,
-    r#"
+  get_syntax_config(),
+  |_| tr(),
+  should_support_context_api,
+  r#"
     function Index () {
         return (
           <View compileMode>
@@ -77,10 +77,10 @@ test!(
 );
 
 test!(
-    get_syntax_config(),
-    |_| tr(),
-    should_render_react_component,
-    r#"
+  get_syntax_config(),
+  |_| tr(),
+  should_render_react_component,
+  r#"
     function Index () {
         return (
           <View compileMode>
@@ -94,10 +94,10 @@ test!(
 );
 
 test!(
-    get_syntax_config(),
-    |_| tr(),
-    should_render_native_component,
-    r#"
+  get_syntax_config(),
+  |_| tr(),
+  should_render_native_component,
+  r#"
     function Index () {
         return (
           <View compileMode>

crates/swc_plugin_compile_mode/src/tests/condition.rs

@@ -1,11 +1,11 @@
+use super::{get_syntax_config, tr};
 use swc_core::ecma::transforms::testing::test;
-use super::{tr, get_syntax_config};
 
 test!(
-    get_syntax_config(),
-    |_| tr(),
-    should_support_and_expr,
-    r#"
+  get_syntax_config(),
+  |_| tr(),
+  should_support_and_expr,
+  r#"
     function Index () {
         return (
           <View compileMode>
@@ -34,26 +34,42 @@ test!(
     }
     "#
 );
+
 test!(
-    get_syntax_config(),
-    |_| tr(),
-    should_support_conditional_expr,
-    r#"
-    function Index () {
-        return (
-          <View compileMode>
-            {condition ? <View hoverClass={myClass}>{content}</View> : <Text selectable>hello</Text>}
-            {condition1 ? condition2 ? <View>{a}</View> : <Text>{b}</Text> : <View>{c}</View>}
-            {condition1 ? <View>{a}</View> : condition2 ? <View>{b}</View> : <Text>{c}</Text>}
-            {condition1 ? <View>{a}</View> : (condition2 ? <View>{b}</View> : <Text>{c}</Text>)}
-            {condition1 ? condition2 && <View>{a}</View> : <View>{b}</View>}
-            {condition1 ? <View>{a}</View> : condition2 && <View>{b}</View>}
-            {condition1 ? "someText" : 789}
-            {condition1 ? <View className={condition2 ? '' : ''} /> : <View/>}
-            {condition1 ? <View>{condition2 ? <View/> : <View/>}</View> : <View/>}
-            <View hoverClass={myClass}></View>
-          </View>
-        )
-    }
-    "#
+  get_syntax_config(),
+  |_| tr(),
+  should_support_conditional_expr,
+  r#"
+  function Index () {
+      return (
+        <View compileMode>
+          {condition ? <View hoverClass={myClass}>{content}</View> : <Text selectable>hello</Text>}
+          {condition1 ? condition2 ? <View>{a}</View> : <Text>{b}</Text> : <View>{c}</View>}
+          {condition1 ? <View>{a}</View> : condition2 ? <View>{b}</View> : <Text>{c}</Text>}
+          {condition1 ? <View>{a}</View> : (condition2 ? <View>{b}</View> : <Text>{c}</Text>)}
+          {condition1 ? condition2 && <View>{a}</View> : <View>{b}</View>}
+          {condition1 ? <View>{a}</View> : condition2 && <View>{b}</View>}
+          {condition1 ? "someText" : 789}
+          {condition1 ? <View className={condition2 ? '' : ''} /> : <View/>}
+          {condition1 ? <View>{condition2 ? <View/> : <View/>}</View> : <View/>}
+          <View hoverClass={myClass}></View>
+        </View>
+      )
+  }
+  "#
+);
+
+test!(
+  get_syntax_config(),
+  |_| tr(),
+  should_support_jsx_container_expr,
+  r#"
+  function Index () {
+      return (
+        <View compileMode>
+          {<View hoverClass={myClass}></View>}
+        </View>
+      )
+  }
+  "#
 );

crates/swc_plugin_compile_mode/src/tests/entry.rs

@@ -1,11 +1,11 @@
+use super::{get_syntax_config, tr};
 use swc_core::ecma::transforms::testing::test;
-use super::{tr, get_syntax_config};
 
 test!(
-    get_syntax_config(),
-    |_| tr(),
-    should_support_multi_compile_mode,
-    r#"
+  get_syntax_config(),
+  |_| tr(),
+  should_support_multi_compile_mode,
+  r#"
     function Index () {
         return (
           <View>