• 使用方式
  • 前提條件
  • 引入方式
    • 方式一：npm 引入
    • 方式二：開(kāi)發(fā)者工具 - 頁(yè)面模板
  • 二次開(kāi)發(fā)

使用方式

前提條件

• 已完成創(chuàng)建小程序。
• 已下載并安裝百度小程序開(kāi)發(fā)者工具（簡(jiǎn)稱 IDE）。
• 部分組合能力示例使用了 Smart UI 組件，建議先閱讀熟悉 Smart UI 使用方式

引入方式

目前模板靈活支持兩種引入方式，npm 和開(kāi)發(fā)者工具快速創(chuàng)建方式

目前創(chuàng)新互聯(lián)建站已為上千家的企業(yè)提供了網(wǎng)站建設(shè)、域名、虛擬主機(jī)、網(wǎng)站托管、服務(wù)器托管、企業(yè)網(wǎng)站設(shè)計(jì)、長(zhǎng)安網(wǎng)站維護(hù)等服務(wù)，公司將堅(jiān)持客戶導(dǎo)向、應(yīng)用為本的策略，正道將秉承"和諧、參與、激情"的文化，與客戶和合作伙伴齊心協(xié)力一起成長(zhǎng)，共同發(fā)展。

方式一：npm 引入

1. 在小程序根目錄執(zhí)行下方命令，下載頁(yè)面模板的對(duì)應(yīng)的 npm 包：

 
 
 

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

1. 將對(duì)應(yīng)的模板文件拷貝到當(dāng)前小程序合適的目錄下（如 pages）：

“模板文件”為 npm 包內(nèi) @smt-ui-template-xxx 文件

 
 
 

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

1. 在小程序根目錄的 app.json 中配置模板頁(yè)面的 path 路徑，查看效果：

 
 
 

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

1. 為了方便在開(kāi)發(fā)者工具中查看模板頁(yè)的效果，可以設(shè)置模板頁(yè)為小程序預(yù)覽的首頁(yè)。該功能的說(shuō)明請(qǐng)參考自定義編譯文檔。

1. 安裝 npm 依賴
   部分模板在使用模板前，需要安裝依賴。詳情請(qǐng)參考對(duì)應(yīng)模板“npm 依賴”版塊。

方式二：開(kāi)發(fā)者工具 - 頁(yè)面模板

1. 打開(kāi)開(kāi)發(fā)者工具，點(diǎn)擊“頁(yè)面模板”，選擇相應(yīng)模板，選中后點(diǎn)擊右下角“立即使用”，填寫相關(guān)信息點(diǎn)擊右下角“完成”按鈕。
   

2. 模板創(chuàng)建后，項(xiàng)目文件夾內(nèi)包含完整的源代碼并且可以直接運(yùn)行預(yù)覽。

二次開(kāi)發(fā)

使用開(kāi)發(fā)者工具的編輯器或者選擇自己熟悉的編輯器對(duì)模板進(jìn)行二次開(kāi)發(fā)。

網(wǎng)站名稱：創(chuàng)新互聯(lián)百度小程序教程：使用方式
文章分享：http://www.dlmjj.cn/article/dpepphd.html