paper.js DevTools

一个用于调试 paper.js 应用的 Chrome DevTools 扩展，帮助开发者可视化、检查和编辑 paper.js 场景树及节点属性。

主要功能

• 可视化 paper.js 场景树结构，支持展开/折叠、节点选择与高亮
• 检查和实时编辑节点属性（如位置、大小、颜色等）
• 切换节点可见性

快速上手

1. 安装依赖并构建扩展

   git clone https://github.com/Allen7D/paper-devtools.git
   cd paper-devtools
   npm install
   npm run build

2. 加载扩展到 Chrome

   • 打开 chrome://extensions/，开启开发者模式
   • 点击“加载已解压的扩展程序”，选择 dist 目录

3. 在你的 paper.js 应用中暴露实例

   // 初始化后添加
   window.__PAPER_JS__ = paper;

4. 打开 DevTools，切换到“paper.js”标签页进行调试

目录结构简介

paper-devtools/
├── src/           # 源码（扩展主逻辑、面板、组件等）
├── public/        # 静态资源
└── ...

开发命令

• npm run dev 启动开发服务器
• npm run build 构建生产版本
• npm run preview 预览生产构建

许可证

MIT