• 使用方式
  • 前提条件
  • 引入方式
    • 方式一：npm 引入
    • 方式二：开发者工具 – 页面模板
  • 二次开发

使用方式

前提条件

• 已完成创建小程序。
• 已下载并安装百度小程序开发者工具（简称 IDE）。
• 部分组合能力示例使用了 Smart UI 组件，建议先阅读熟悉 Smart UI 使用方式

引入方式

目前模板灵活支持两种引入方式，npm 和开发者工具快速创建方式

方式一：npm 引入

1. 在小程序根目录执行下方命令，下载页面模板的对应的 npm 包：

 
 
 

  
  
  
npm i @smt-ui-template/page-status // 模板名称
 
 
 

1. 将对应的模板文件拷贝到当前小程序合适的目录下（如 pages）：

“模板文件”为 npm 包内 @smt-ui-template-xxx 文件

 
 
 

  
  
  
.
  
  
  
├── project.swan.json 
  
  
  
├── app.json 
  
  
  
├── app.js 
  
  
  
├── pages
  
  
  
 └── @smt-ui-template-status // 模板文件
 
 
 

1. 在小程序根目录的 app.json 中配置模板页面的 path 路径，查看效果：

 
 
 

  
  
  
{
  
  
  
 "pages": [
  
  
  
 ...
  
  
  
 "pages/@smt-ui-template-status/index"
  
  
  
 ...
  
  
  
 ]
  
  
  
}
 
 
 

1. 为了方便在开发者工具中查看模板页的效果，可以设置模板页为小程序预览的首页。该功能的说明请参考自定义编译文档。

1. 安装 npm 依赖
   部分模板在使用模板前，需要安装依赖。详情请参考对应模板“npm 依赖”版块。

方式二：开发者工具 – 页面模板

1. 打开开发者工具，点击“页面模板”，选择相应模板，选中后点击右下角“立即使用”，填写相关信息点击右下角“完成”按钮。
   

2. 模板创建后，项目文件夹内包含完整的源代码并且可以直接运行预览。

二次开发

使用开发者工具的编辑器或者选择自己熟悉的编辑器对模板进行二次开发。