Sketch Measure 开源项目教程

Sketch Measure 开源项目教程

sketch-measureMake it a fun to create spec for developers and teammates项目地址:https://gitcode.com/gh_mirrors/sk/sketch-measure

项目的目录结构及介绍

Sketch Measure 是一个用于 Sketch 设计的标注工具，可以帮助设计师生成设计规范和标注。以下是该项目的目录结构及其介绍：

sketch-measure/
├── README.md
├── appcast.xml
├── assets/
│   ├── icons/
│   └── images/
├── lib/
│   ├── actions/
│   ├── classes/
│   ├── commands/
│   ├── components/
│   ├── controllers/
│   ├── helpers/
│   ├── models/
│   ├── views/
│   └── utils.js
├── manifest.json
├── package.json
├── resources/
│   └── icon.png
└── src/
    ├── index.js
    └── styles.css

• README.md: 项目说明文档。
• appcast.xml: 用于更新检查的文件。
• assets/: 包含项目的图标和图片资源。
• lib/: 包含项目的核心代码，包括各种模块和功能。
• manifest.json: Sketch 插件的清单文件，定义了插件的基本信息和入口点。
• package.json: Node.js 项目的配置文件，包含项目的依赖和脚本。
• resources/: 包含插件的图标资源。
• src/: 包含项目的源代码，包括入口文件和样式文件。

项目的启动文件介绍

Sketch Measure 的启动文件位于 src/index.js。这个文件是插件的入口点，负责初始化插件并注册各种命令和功能。以下是 index.js 的简要介绍：

import './styles.css';
import { registerCommands } from './commands';

export function onStartup() {
  registerCommands();
}

• import './styles.css';: 导入插件的样式文件。
• import { registerCommands } from './commands';: 导入并调用注册命令的函数。
• export function onStartup() { ... }: 定义插件启动时执行的函数。

项目的配置文件介绍

Sketch Measure 的配置文件主要包括 manifest.json 和 package.json。

manifest.json

manifest.json 是 Sketch 插件的清单文件，定义了插件的基本信息和入口点。以下是该文件的内容示例：

{
  "name": "Sketch Measure",
  "description": "Make it a fun to create spec for developers and teammates",
  "author": "utom",
  "homepage": "https://github.com/utom/sketch-measure",
  "version": "2.7.9",
  "identifier": "com.utom.sketch-measure",
  "appcast": "https://raw.githubusercontent.com/utom/sketch-measure/master/appcast.xml",
  "commands": [
    {
      "name": "Measure",
      "identifier": "measure",
      "script": "./src/index.js",
      "handlers": {
        "run": "onRun",
        "actions": {
          "Shutdown": "onShutdown"
        }
      }
    }
  ],
  "menu": {
    "title": "Sketch Measure",
    "items": [
      "measure"
    ]
  }
}

• name: 插件的名称。
• description: 插件的描述。
• author: 插件的作者。
• homepage: 插件的主页。
• version: 插件的版本号。
• identifier: 插件的唯一标识符。
• appcast: 更新检查的 URL。
• commands: 定义插件的命令和对应的脚本。
• menu: 定义插件在 Sketch 菜单中的显示。

package.json

package.json 是 Node.js 项目的配置文件，包含项目的依赖和脚本。以下是该文件的内容示例：

{
  "name": "sketch-measure",
  "version": "2.7.9",
  "description": "Make it a fun to create spec for developers and teammates",
  "main": "src/index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },

sketch-measureMake it a fun to create spec for developers and teammates项目地址:https://gitcode.com/gh_mirrors/sk/sketch-measure