新旧对比
# 调试/修改代码
-
老旧的开发方式：(修改 -> 编译 -> 重启插件 -> 运行插件)
-
新的开发方式：(修改 -> 预览编译 -> 刷新预览)
# 修改 UI
-
老旧的开发方式：(修改运行时 html(可选) -> 修改 html -> 编译 -> 重启插件 -> 运行插件)
…时间太长就不录了
-
新的开发方式：(编辑器修改 -> 刷新预览)
不要问我为什么字往上飘，因为我又不小心发现一个 bug，字体缩放不为(1,1) 且 widget 靠上修改 label 就会出现
没有 bug 的 cocos 我不爱
商店链接
https://store.cocos.com/app/detail/4897
我已经给大家设置了节日优惠，需要的可以购买
使用文档
# 初始化
-
安装插件编译器，命令行执行
npm i -g @muzzik/cc-plugin-cli -
初始化项目依赖包，项目根目录 下命令行执行
npm i -
初始化插件依赖包，项目根目录/extensions_dev/mk-project-template-plugin 下命令行执行
npm i -
编译插件，参考下方说明
-
启用插件（菜单栏：扩展/扩展管理器）
-
按下 F3 键即可见到插件面板，如果快捷键被占用可通过菜单栏打开
# 编译插件
-
两种编译方式（任选其一）
1.1. vscode 提供的 npm 脚本窗口
1.2. 手动编译
命令行执行：cc-plugin-cli c -p 插件开发目录绝对路径- 插件开发目录示例：
xxx\extensions_dev\mk-project-template-plugin
- 插件开发目录示例：
-
什么时候需要编译插件？
- 当你安装了新的 npm 包的时候
- 修改了插件开发目录下的源码
# 开发阶段
-
怎么在 creator 中使用 Nodejs
以 fs 模块导入举例：const fs = require("fs") as typeof import("fs"); -
怎么刷新插件预览？
选中插件面板按 f5 进行手动刷新 -
怎么使用 html 混合开发？
-
标签类型
以一个 ui-button 组件举例
节点名 # 前面的字符就代表标签类型，例如 div 就是div# -
标签属性
在节点上添加tool_tag组件，设置属性列表
提供两种方式：-
key:data
这代表直接进行赋值，例如style.background-color: red就是将标签的 style.background-color 赋值为 red -
key=data
这代表调用标签的 setAttribute 方法，参数为 (key, data)
-
注意：之所以能使用 html 混合开发，是因为有一层 html 叠加在 creator 的界面上，所以 html 标签不能被 creator UI 遮挡
-
-
无边框窗口
在插件开发目录的src/config.ts修改
注意：使用无边框将无法使用 cocos 自带的 ui 组件
# 打包发布
-
将我们的 creator 工程发布为 web-mobile
-
进入构建输出目录打包为 web-mobile.zip (名字必须相同)
-
将压缩包拷贝到插件输出目录中 src 的同级目录 res 中（没有则创建）
-
再把插件输出目录打为压缩包即可发布到商店（注意加密）
