第三方自定義組件

第三方自定義組件包的開發(fā)與自定義組件開發(fā)基本相同，差異就是需要使用 npm 來管理自定義組件包。要求開發(fā)者具有基礎(chǔ)的 node.js 和 npm 相關(guān)的知識，如若之前未接觸過 npm，可參考官方 npm 文檔，同時需要百度開發(fā)者工具輔助開發(fā)。

開發(fā)前準備

要求開發(fā)者具有基礎(chǔ)的 node.js 和 npm 相關(guān)的知識，同時需要百度開發(fā)者工具輔助開發(fā)。
下載百度開發(fā)者工具。 Windows 64 版下載地址 | Mac 版下載地址。

使用 npm 包

在小程序根目錄中執(zhí)行命令安裝 npm 包。下載后的文件在文件夾 node_modules 中。

 
 
 
  
  
  npm install

在引用的時候，直接使用包中 package.json 的 name 名字即可。

 
 
 
  
  
  "usingComponents": {  
  
   "swan-custom-component": "swan-custom-component"  
  
  }

開發(fā) npm 包

下載模板

為了方便開發(fā)者能夠快速開發(fā)第三方自定義組件，為此提供了一個可用于開發(fā)、調(diào)試、測試用的項目模板，可以通過以下幾種方式進行下載：

直接從 github 上下載 zip 文件并解壓，文件夾 swan-custom-component 下即為自定義組件模板；
直接從 github 上的倉庫 clone 下載，cd swan-custom-component 進入即為自定義組件模板；
使用命令行工具初始化項目，用法見下面說明。

命令行工具

快速安裝

 
 
 
  
  
  npm install -g smartprogram-cli

初始化自定義模板

 
 
 
  
  
  smartprogram init --type custom-component test

執(zhí)行完上述命令后會生成以 test 為文件名的自定義組件模板，開發(fā)者可以在此項目中進行開發(fā)修改。命令行工具的更多用法可以查看 github 倉庫上的 README.md 文件。

發(fā)布 npm 包

發(fā)布 npm 包的流程簡述如下：

如果還沒有 npm 帳號，可以到 npm 官網(wǎng)注冊一個 npm 帳號。

在本地登錄 npm 帳號，在本地執(zhí)行：

   
   
   
    
    
    npm adduser

或者

   
   
   
    
    
    npm login

在已完成編寫的 npm 包根目錄下執(zhí)行：

   
   
   
    
    
    npm publish

至此，npm 包就成功發(fā)布到 npm 平臺了。

一些開發(fā)者在開發(fā)過程中可能修改過 npm 的源，所以當進行登錄或發(fā)布時需要注意要將源切回 npm 的源。

分享題目：創(chuàng)新互聯(lián)百度小程序教程：第三方自定義組件
文章網(wǎng)址：http://www.5511xx.com/article/cciigse.html

新聞中心