小程序开放平台

文档中心
概览
更新日志
框架开发
代码编辑
开发辅助
测试小程序
AI 助手(Beta)

概览

工具
>
概览
>
更新时间:2024-12-03 14:05:01

最新版下载

项目管理页面

启动页

用户查看管理当前项目,可以在此页面创建、导入、删除项目

创建项目

启动页

输入项目名称、项目目录、AppId等即可创建新项目

主界面

图中所示分别为:工具栏、模拟器、编辑器、调试器四大部分。

启动页

登录

在登录页面,或主页面点击左上角头像,使用小红书app扫码登录

模拟器

工具栏

  • 编译:编译当前的小程序项目编译
  • 预览:生成二维码,真机预览小程序预览
  • 上传:填入 app 版本号及更新日志,上传小程序应用内容到服务器上传
  • 详情:展示当前小程序的 appid、user_id、本地目录、文件系统、基础版本与编译版本等信息,以及本地设置详情
  • 通知:由小红书小程序官方团队所发布的,告知广大小程序开发者的内容,可以点击 我已知晓 标记为已读状态通知

模拟器

模拟器模拟小红书小程序在客户端真实的逻辑表现,对于绝大部分的 API 均能够在模拟器上呈现出正确的状态。开发者可以选择不同的设备,调试小程序在不同尺寸机型上的适配问题。

模拟器

编辑器

编辑器模块内可以对当前项目进行代码编写和文件的添加、删除以及重命名等基本操作,并集成了 Git、插件等功能。(操作逻辑类比vscode)

调试器

调试器包含如下功能模块:

Elements panel

Elements panel 用于帮助开发者开发 rml 转化后的界面。在这里可以看到真实的页面结构以及结构对应的 css 属性,同时可以通过修改对应 css 属性,在模拟器中实时看到修改的情况(仅为实时预览,无法保存到文件)。通过调试模块左上角的选择器,还可以快速定位页面中组件对应的 rml 代码。

Console panel

开发者可以在此调试代码。

Sources panel

Sources panel 用于显示当前项目的脚本文件,同浏览器开发不同,小程序框架会对脚本文件进行编译的工作,所以在 Sources panel 中开发者看到的文件是经过处理之后的脚本文件,开发者的代码都会被包裹在 define 函数中,并且对于 Page 代码,在尾部会有 require 的主动调用。

Network panel

Network Panel 用于观察和显示 request 和 socket 的请求情况。

AppData panel

AppData panel 用于展示以及修改当前 page 的 data 属性

Storage panel

可以查看 Storage 存储情况。

上传提审

点击工具栏的"上传"按钮,填写版本号, 填写更新日志,点击确认上传至开发者平台。