V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
V2EX 提问指南
w88975
V2EX  ›  问与答

关于 AST 转 JSX 的疑问.

  •  
  •   w88975 · 2021-07-06 12:58:13 +08:00 · 330 次点击
    这是一个创建于 626 天前的主题,其中的信息可能已经有所发展或是发生改变。

    某段 React JSX 的代码, 通过 acorn 转为 JS 的 AST 树, 在通过 AST 树转回 JS 代码, 但是最后输出的代码里,JSX 部分被转为了 h 函数.

    JSX 代码

    export default function Home() {
      return (
        <View className={styles.homeContainer}>
          <Logo uri="//gw.alicdn.com/tfs/TB1MRC_cvb2gK0jSZK9XXaEgFXa-1701-1535.png" />
          <Text className={styles.homeTitle}>Welcome to Your Rax App</Text>
          <Text className={styles.homeInfo}>More information about Rax</Text>
          <Text className={styles.homeInfo}>Visit https://rax.js.orgx</Text>
        </View>
      );
    }
    

    output 代码

    export default function Home() {
        return h("View", {
            className: styles.homeContainer
        }, [h("Logo", {
            uri: "//gw.alicdn.com/tfs/TB1MRC_cvb2gK0jSZK9XXaEgFXa-1701-1535.png"
        }), h("Text", {
            className: styles.homeTitle
        }, ["Welcome to Your Rax App"]), h("Text", {
            className: styles.homeInfo
        }, ["More information about Rax"]), h("Text", {
            className: styles.homeInfo
        }, ["Visit https://rax.js.orgx"])]);
    }
    

    问: 如何才能将 AST 转回 JS 代码的时候, JSX 部分保持原有的 JSX 语法, 而不是 JS 函数?

    triple7
        1
    triple7  
       2021-07-06 14:45:27 +08:00
    你是用什么把 ast 转为代码的。
    w88975
        2
    w88975  
    OP
       2021-07-06 16:09:04 +08:00
    @triple7 jsx-ast-transformer astring
    triple7
        3
    triple7  
       2021-07-06 17:04:16 +08:00
    建议你把细节说明下,关键代码。

    按照我搜索到的库,你是这样使用的吗

    let ast = transform(jsx_ast, { factory: "h" });

    另外为啥不用 babel,这是比较成熟的全套方案,而且有丰富的文档。
    triple7
        4
    triple7  
       2021-07-06 17:06:01 +08:00
    按照 jsx-ast-transformer 项目介绍:
    Transforms JSX AST into regular JS AST

    大概率是只能转到 js ast 。
    关于   ·   帮助文档   ·   博客   ·   nftychat   ·   API   ·   FAQ   ·   我们的愿景   ·   广告投放   ·   实用小工具   ·   2189 人在线   最高记录 5556   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 140ms · UTC 02:00 · PVG 10:00 · LAX 19:00 · JFK 22:00
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.