创建第一个插件应用

打开「uTools 开发者工具」

开发者工具主界面

新建项目

点击开发者工具左下侧的 新建项目 按钮，打开项目配置界面。

新建项目界面

根据表单要求填写相关信息。

勾选 "同意 uTools 开发者协议" ，点击右下角的确定，完成创建。

填写应用信息

插件应用名称: 不使用特殊符号，例如操作系统不支持的文件名符号、Emoji 等。
插件应用描述：可以帮助其他用户快速的了解应用包含的功能，尽量简洁且清晰
运行平台：支持的操作系统平台。（uTools 是跨平台的）
开发者名称：插件应用市场会显示该应用开发者名称

创建工程文件夹

通过 uTools 开发者工具 “新建React+Vite工程” / “新建Vue+Vite工程” 按钮，根据步骤自动创建。
或手动创建工程文件夹

TIP

文件夹的名字可以是任意的，但是我们尽量保证跟插件应用有一定关联性以及尽量使用英文。比如你的第一个插件应用名字可能是“第一个插件”，文件夹名字可以是“my-first-plugin”。

工程文件夹下的文件

在工程文件夹下准备 logo、主界面入口文件以及必不可少的 plugin.json 文件。

plugin.json

{
  "logo": "logo.png",
  "main": "index.html",
  "features": [
    {
      "code": "test",
      "cmds": [
        "第一个插件"
      ],
      "description": "第一个插件"
    }
  ]
}

TIP

关于 plugin.json 更多信息，请查看配置文件介绍。

开始编写插件应用

插件应用的界面基于 Web 页面实现，本例通过 plugin.json 中的 main 指定 index.html 作为主界面入口。

对于有 Web 开发经验的开发者来说，这种方式简单且易于上手。

现在，为你的插件应用输出最基础的内容：一行 Hello World。

index.html

html

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
</head>
<body>
  <h1>Hello World</h1>
</body>
</html>

TIP

后续开发中，可以继续使用 uTools 提供的各种 API，例如：

如果需要使用更强大的本地能力，可以为项目加入 preload.js，通过 preload 桥接层使用 Node.js 能力。

安装工程到 uTools

点击应用开发界面的 导入源码工程 按钮，选择工程中的 plugin.json 配置文件。

未选择plugin.json

选择 plugin.json 文件后，开发者工具就会根据此文件自动识别工程。

选择plugin.json后

点击 安装（开发模式），即可将该源码工程作为开发中的插件应用安装到 uTools。

安装开发工程

点击打开，即可看到刚刚创建的插件应用。🎉

插件运行效果

创建第一个插件应用 ​

打开「uTools 开发者工具」 ​

新建项目 ​

创建工程文件夹 ​

工程文件夹下的文件 ​

开始编写插件应用 ​