npm上建立發佈package

在npm維護package能夠方便版本更新、使用、複用。
這篇文章裏會聊從零開始在npm上建立發佈package.
簡單來講就是：

1. 在本地初始化包。（npm init）
2. 建立內容。（最後規範）
3. 在https://www.npmjs.com網站上注...。
4. 在本地用這個帳號登陸。（npm login, 再輸name,password,email）
5. 發佈（npm publish）

如下是詳細步驟。

1. install

初裝必要環境。
node, npm

2. register

在npm網站建立一個帳號。
進入官網-進入註冊頁面-驗證郵箱地址。

3. create

在本地建立一個目錄，並進入。

mkdir ...
cd ...
npm init
// 再輸入相應信息。

4. adduser

npm adduser

5. login

npm login
//有多是 npm adduser
// 再輸入帳號、密碼。

6. 建立基本內容

README.md // 介紹當前package，能夠不建立。
index.js // 與package.json裏的main值同樣。它是做爲入口文件的。
再建立package的內容。包文檔結構以下：

assets 是用來放置資源。
assets/basic 我我的習慣用來放置基本內容。能夠無論。
assets/img 是用來放置圖片。
conponents 是用來放置組件。
conponents/vueName 是用來放置當前組件須要的子組件。
conponents/vueName/index 通常是該組件。
lib 全部組件須要的數據資源。
.gitignore 指定須要git忽略的內容。
index 當前包的入口文件。
package 當前包的信息。
README.md 介紹當前包。

當前包的入口文件中index.js文件。在該文件中須要把名組件輸出。

// package/index.js
import first from './src/components/first'
import second from './src/components/second'
export {
  first,
  second
}

7. 發佈

npm publish

<!-- package name 已經被註冊 -->
npm ERR! publish Failed PUT 403
npm ERR! code E403
npm ERR! Package name too similar to existing packages; try renaming your package to '@feigebaobei/secondtest' and publishing with 'npm publish --access=public' instead : secondtest

<!-- 郵箱未驗證 -->
<!-- 鏡像問題 -->

issue

// 報錯
npm ERR! publish Failed PUT 401
npm ERR! code E401
npm ERR! 404 unauthorized Login first: firstasdfqwer1234
npm ERR! 404
npm ERR! 404  'firstasdfqwer1234' is not in the npm registry.
npm ERR! 404 You should bug the author to publish it (or use the name yourself!)
// 解決方法
npm config set registry https://registry.npmjs.org/
npm adduser
npm login
npm publish

// 報錯
Package name triggered spam detection; if you believe this is in error, please contact support@npmjs.com : firstasdfqwer1234
// 解決方法
// 改成正常的名字

8. 刪除

當前包的做者能夠刪除。admin角色（24 小時內可刪除）

npm unpublish packagename --force

當前團隊的擁有者或owner角色。點擊刪除按鈕可把該package從team中刪除。

9. 不足

npm還有一些不足。eg:1.協做者不能刪除package.2.多個協做者不能同時編輯同一個package.3.沒法刪除org。4.24h後不可刪除該包。

10. 測試

在發佈前最後先測試是否能正常工做。我採用的方法是建立一個vue項目把package放在src/components/下。使用相對連接引用。這是開發階段的測試。若須要在正式測試須要再建立一個vue項目。使用npm i packageName安裝該包，再使用包。若經過這2個測試就能夠正常使用了。

---

2018/11/06 by stone