前景

在最近的公司項(xiàng)目中，前端項(xiàng)目很多都需要一些類似功能的公共方法（工具方法）。于是我萌發(fā)了一個(gè)想法，自己建一個(gè)npm包，用來收錄公司前端常用的一些公共方法，然后發(fā)布到npm上，這樣不管以后哪個(gè)項(xiàng)目要使用，只需要一個(gè)npm install。逼格又高又方便。

創(chuàng)建項(xiàng)目

• 首先第一步，為了方便維護(hù)自己的項(xiàng)目，管理自己的代碼，現(xiàn)在github上創(chuàng)建一個(gè)項(xiàng)目

創(chuàng)建完成：地址 https://github.com/LeoMelody/dd_leo_common

project.png

• 將項(xiàng)目拷到本地

• 進(jìn)入項(xiàng)目，打開命令行，運(yùn)行 npm init （初始化 packag.json 文件）

• 構(gòu)建一個(gè)npm包的架構(gòu)
  創(chuàng)建 lib文件夾（存放js代碼）
  創(chuàng)建 index.js 包入口文件
  .....
  包結(jié)構(gòu)完成圖：

  
  
  package.png

隨便寫點(diǎn)什么吧

我是在lib目錄下創(chuàng)建了一個(gè)arrayUtils工具類，用來存放我的一些常用的數(shù)組操作方法，如圖：

array.png

在index.js中引入這個(gè)js：

image.png

包發(fā)布

• 首先要注冊一個(gè)npm賬號

• 開始敲命令行：

  npm adduser
  Username: xxxxx
  password: xxxxxx
  email: xxxx@xxx

• 上面命令敲完以后，在package.json目錄下敲下面這行命令

npm publish .

這時(shí)候，如果提示你沒有驗(yàn)證郵箱，就去驗(yàn)證一下就好了。

現(xiàn)在，這個(gè)npm 包已經(jīng)推廣上去了（我這個(gè)還在開發(fā)階段，還沒有搞上去）

最后，你可以發(fā)布上傳一個(gè)自己的npm包供他人使用，是不是逼格很高。