本文主要講述基於webpack編寫js包檔案後上傳到npm，並通過cdn進行訪問。

建立專案

在自己新建的資料夾下執行如下程式碼：

npm init

name: (mtmap)
version: (1.0.0)
description: xxxxx
entry point: (/dist/gaia.demo.map.js)
test command:
git repository:
keywords:
author: allanhao
license: (ISC) MIT
About to write to E:\github\mtmap\package.json:

{
  "name": "mtmap",
  "version": "0.1.0",
  "description": "xxxxx",
  "main": "/dist/gaia.demo.map.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "allanhao",
  "license": "MIT"
}
Is this ok? (yes) 
 

按照提示填寫基本資訊

確認後會發現檔案目錄內多出來一個package.json檔案

開始寫程式碼，參照webpack教程

釋出到NPM

註冊npm賬號

在npm官網註冊https://www.npmjs.com。
注意郵箱要驗證，會發送驗證連結到你的註冊郵箱，沒有驗證的話是不能釋出程式碼的

新增.npmignore檔案，例：

/**/*
!dist/gaia.demo.map.js
!ACKNOWLEDGEMENT
 

這樣會將build後的dist資料夾內的js包檔案釋出到npm，方便後續通過cdn訪問

提交發布上面建立的包

• 先登入你的npm賬號

$ npm adduser    
Username: your name
Password: your password 
Email: yourmail

按照你註冊的賬號配置好，這時候看一下package.json中author儘量與npm賬戶一致

在根目錄下配置賬號資訊，只用配置一次即可，我上傳的時候發現有提示必須admin許可權才能上傳問題就是沒在根目錄下配置資訊

• 檢查是否登入成功:

npm who am i
# 如果不成功則重新登入一下
npm login

• 配置成功之後提交程式碼

npm publish

注意：如果提示包不能為private，需要執行下面的釋出方式：

npm publish --access public

注意每次提交版本號都要比上次的高

• 測試是否提交成功

去官網你的賬號下面看一下有沒有
或者直接npm下載下來

npm i mtmap

npm的版本控制

在我們的package.json裡面有一個version欄位 ，每次提交到npm，版本號需要增加。 或者自己手動修改，或者使用 “npm version ” 命令

npm有一套自己的版本控制標準——Semantic versioning（語義化版本）

具體體現為：
對於"version":"x.y.z"
1.修復bug,小改動，增加z
2.增加了新特性，但仍能向後相容，增加y
3.有很大的改動，無法向後相容,增加x

例如：我原本的專案是1.0.0版本的話
若是1中情況，變為1.0.1
若是2中情況，變為1.1.0
若是3中情況，變為2.0.0

通過npm version 自動改變版本
update_type為patch, minor, or major其中之一，分別表示補丁，小改，大改

一些常見的錯誤

1.no_perms Private mode enable, only admin can publish this module

這是因為映象設定成淘寶映象了，設定回來即可

npm config set registry http://registry.npmjs.org

2.npm publish failed put 500 unexpected status code 401

一般是沒有登入，重新登入一下 npm login 即可

3.npm ERR! you do not have permission to publish “your module name”. Are you logged in as the correct user?

包名被佔用，改個包名即可。最好在官網查一下是否有包名被佔用，之後再重新命名

4.you must verify your email before publishing a new package

郵箱未驗證，去官網驗證一下郵箱

通過CDN訪問

這裡使用的是jsdelivr

地址格式為：

https://cdn.jsdelivr.net/npm/(your packagename)@(version)/(file)

如：

https://cdn.jsdelivr.net/npm/[email protected]/dist/jquery.min.js