一个帮助你在思源中用 React 记录笔记的挂件

简介

可以帮助你在思源笔记中，嵌入 React Live 用 React 编写笔记内容，并实时查看代码结果

怎样使用

思源 -> 设置 -> 集市 -> 挂件 -> 找到 React REPL -> 安装即可

仓库地址

GitHub - Blackman99/siyuan-plugin-react-repl: Make it possible to embed react repl in SiYuan note apps Make it possible to embed react repl in SiYuan note apps - GitHub - Blackman99/siyuan-plugin-react-repl: Make it possible to embed react repl in SiYuan note apps GitHub - github.com

效果演示

功能

• 具有官方 React Live 全部的完整功能
• 代码自动保存

限制

• 目前涉及的 js 模块依赖都是访问 https://esm.sh/ 上的资源，使用时需联网
• 跟 Vue REPL 还有 Svelte REPL 不太一样，不支持多文件，比较轻量，但是在 React 中一个函数即是一个组件，可以用作简单的示例编写

结语

希望能帮助到你用 React 愉快地记录你的笔记！

参考

• React
• React live