某段 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 函数?
这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。
V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。
V2EX is a community of developers, designers and creative people.