tscircuit - 电路开发的 React 范式​ 用TypeScript、React和 AI工具构建电子产品

“ 用 TypeScript、React 和 AI 工具构建电子产品。”

tscircuit 让电子开发如同 Web 开发般便捷。在您熟悉的 IDE 中编写代码，实时观察代码改动生成电路设计。完成后，直接导出项目并投入生产！

什么是 tscircuit?

tscircuit 是一个由 注册中心、包管理器、命令行工具和 AI 电子设计套件 共同支持的开发库，它能轻松实现电子电路的创建、共享、导出与生产制造。该库通过 React Fiber 引擎 将电路设计实时渲染为网页可视化界面。

你可以将 tscircuit 视为 "电子领域的 React" —— 它允许开发者使用 TypeScript 和 React 设计真实世界的电子电路。其开发范式并非创建 "div" 等网页元素，而是定义 "芯片"、"电阻" 或 "电容" 等电路元件，最终渲染输出的也不是网站，而是 3D 的电路（可直接下单生产）！

通过 tscircuit，你甚至能设计出具备完整功能的键盘电路！完成设计后，可直接将方案导出至合作制造商，订购真实可用的电路板成品。

样例

一个 wifi 的测试板。可以点击以下链接直接查看：

https://tscircuit.com/seveibar/wifi-test-board-1#files ts 的代码：

 

import { Reg5vTo3v3 } from "@tsci/seveibar.reg-5v-to-3v"import { useESP32_S3_MINI_1_N8 } from "@tsci/seveibar.esp32-s3-mini-1-n8"import { useUsbC } from "@tsci/seveibar.smd-usb-c"import { useResistor } from "@tscircuit/core"export default () => {  const Usb = useUsbC("USB")  const Esp32 = useESP32_S3_MINI_1_N8("U1")  const R1 = useResistor("R1", { resistance: "5.1k", footprint: "0402" })  const R2 = useResistor("R2", { resistance: "5.1k", footprint: "0402" })
  return (                                        )}

 

对应的原理图：

对应的 PCB：

渲染的 3D：

如何使用？

可以使用 tsci 命令行工具完成 tscircuit 的所有操作。

 

npm install -g tscircuittsci dev

 

打开浏览器： http://localhost:3020

从其它EDA工具中导入器件库

tscircuit 目前支持将立创eda 和 KiCad 的器件库导入成 tscircuit 的格式：

 

 

原理图/PCB 自动布线

您可以使用 schAutoLayoutEnabled 和 pcbAutoLayoutEnabled 两种工具自动布局原理图和 PCB。

 

import { SmdDiode } from "@tsci/seveibar.SmdDiode"import { Key } from "@tsci/seveibar.Key"import { Pico2 } from "@tsci/seveibar.pico2"const rowToMicroPin = {0: "GP0",1: "GP1",2: "GP10",}const colToMicroPin = {0: "GP19",1: "GP17",2: "GP5",}export default () => (    {grid({ sizeX: 3, sizeY: 3, pitch: 19.05, offset: { x: 20, y: 0 } }).map(    ({ x, y, row, col }, index) => {      const schOffX = 5 + x/6      const schOffY = -y / 8      return (                                                                        )    }  )})function grid(opts: {sizeX: numbersizeY: numberpitch: numberoffset?: { x: number; y: number }}): Array<{ x: number; y: number; row: number; col: number }> {const { sizeX, sizeY, pitch, offset = { x: 0, y: 0 } } = optsconst points: Array<{ x: number; y: number; row: number; col: number }> = []const startX = (-(sizeX - 1) * pitch) / 2const startY = (-(sizeY - 1) * pitch) / 2for (let row = 0; row < sizeY; row++) {  for (let col = 0; col < sizeX; col++) {    points.push({      x: startX + col * pitch + offset.x,      y: startY + row * pitch + offset.y,      row,      col,    })  }}return points}

对自动布线有兴趣的小伙伴可以看一下 tscircuit 的这个仓库： https://github.com/tscircuit/schematic-autolayout 在线封装查看器 tscircuit 还支持了一个子项目，可以在 Web 中查看元器件符号和封装： https://tscircuit.github.io/kicad-viewer

仓库 & Playground tscircuit 的完整仓库在这里： https://github.com/tscircuit/tscircuit 使用 MIT 的 License，完全开源了，仓库里有不少有意思的项目，比如在线封装查看器、自动布线器等等 如果您不想本地安装，也可以在 Playground 在线体验一下： https://tscircuit.com/editor 结束语 如果您看到这儿，肯定会问：tscircuit 是否会取代现有的 PCB 工具？ 我的观点是目前阶段还不行，毕竟 tscircuit 只能实现一些基础的操作，实现一些简单的板子；如果项目稍微复杂一点，整体效率肯定不如成熟的 EDA 工具。 但 tscircuit 同样是一个非常有意思的项目，它用文本（ts）来描述原理图和PCB，这在 AI 时代是一种很有价值和想象空间的尝试，同时 tscircuit 使用了 React Fiber 技术，实现了基于 Web 的在线渲染，使设计不需要借助其他应用就实现了可视化，与类似 skidl 的项目相比，师一个明显的优势，可以让设计师从 基于 GUI 的设计 -> 基于代码 的设计过渡得更自然。 那么在不久的未来，AI 是否可以取代人类工程师，进行原理图和 PCB 的设计呢？