在小程序開發(fā)中使用npm的方法
微信小程序在 2.2.1 版本后增加了對 npm 包加載的支持，使得小程序支持使用 npm 安裝第三方包。
1. 在小程序中加載 npm 包
npm install miniprogram-datepicker --production
node_modules可以 在小程序根目錄下，也可以存在于小程序根目錄下的各個子目錄中。但是不可以 在小程序根目錄外。使用--production選項，可以減少安裝一些業(yè)務(wù)無關(guān)的 npm 包，從而減少整個小程序包的大小。
2. 構(gòu)建 npm 包
在微信小程序開發(fā)工具的「工具」菜單下點擊「構(gòu)建 npm」命令，進行 npm 包的構(gòu)建，此構(gòu)建可以將 npm 包構(gòu)建成在小程序中可加載使用的包。
node_modules 目錄不會參與編譯、上傳和打包中，所以小程序想要使用 npm 包必須走一遍“構(gòu)建 npm”的過程，在最外層的 node_modules 的同級目錄下會生成一個 miniprogram_npm 目錄，里面會存放構(gòu)建打包后的 npm 包，也就是小程序真正使用的 npm 包。
構(gòu)建打包分為兩種：小程序 npm 包會直接拷貝構(gòu)建文件生成目錄下的所有文件到 miniprogram_npm 中；其他 npm 包則會從入口 js 文件開始走一遍依賴分析和打包過程（類似 webpack）。
尋找 npm 包的過程和 npm 的實現(xiàn)類似，從依賴 npm 包的文件所在目錄開始逐層往外找，直到找到可用的 npm 包或是小程序根目錄為止。
構(gòu)建完成后還需要確認項目已勾選了「使用 npm 模塊」。
3.使用npm包
js 中引入 npm 包：
const package = require('packageName')
使用 npm 包中的自定義組件：
{
"usingComponents": {
"datepicker": "miniprogram-datepicker"
}
}
miniprogram-datepicker組件運行效果
其他
微信小程序npm支持文檔：https://developers.weixin.qq.com/miniprogram/dev/devtools/npm.html
以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。
相關(guān)文章
JavaScript Scoping and Hoisting 翻譯
希望這篇文章能夠給JavaScript程序員最容易困惑的部分一些啟示。我盡力寫的全面，以免引起更多的困惑。如果我寫錯了或是漏掉了某些重要的東西，請一定讓我知道2012-07-07
這篇文章主要介紹了微信小程序中選中手機相冊圖片上傳到服務(wù)器的步驟,現(xiàn)圖片上傳我們需要使用chooseImg和uploadFile這兩個api,本文通過實例代碼給大家介紹的非常詳細,需要的朋友參考下吧2024-04-04
這篇文章主要介紹了在微信小程序中使用圖表的方法示例，文中通過示例代碼介紹的非常詳細，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-04-04
本文介紹下，js代碼獲取IP地址的三種方法，通過三個例子來了解如何在js中取得客戶端的IP地址。有需要的朋友不妨作個參考2014-07-07
這篇文章介紹了JS隨機生成不重復(fù)數(shù)據(jù)的實例方法，有需要的朋友可以參考一下2013-07-07
JavaScript一種沒有類的，面向?qū)ο蟮恼Z言，它使用原型繼承來代替類繼承。2010-11-11
javascript實現(xiàn)自動輸出文本（打字特效）
文字如何實現(xiàn)打字的效果呢?在瀏覽網(wǎng)頁的時候也經(jīng)常能看到這種效果。本文給大家匯總介紹了幾種打字效果的文字特效,文字一個一個地打印在頁面上。2015-08-08
解決JS內(nèi)存泄露之js對象和dom對象互相引用問題
這篇文章主要介紹了解決JS內(nèi)存泄露之js對象和dom對象互相引用問題,需要的朋友可以參考下2017-06-06
本文介紹了如何通過裝飾器實現(xiàn)GET請求,文中通過示例代碼介紹的非常詳細,對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2024-10-10
解決方案其實就是冒泡排序的一個包裝,本補丁不修復(fù)各瀏覽的排序算法不一致的問題2011-10-10