本文主要講述基於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)
按照提示填寫基本信息
| 配置項 | 意義 | 默認值 |
|---|---|---|
| name | 包的名字 | 默認是所在文件夾的名字 |
| version | 包的版本 | 1.0.0 |
| description | 項目描述 | |
| entry point | 入口文件 | index.js |
| test command | 測試命令 | |
| git respository | 源代碼git倉庫地址 | |
| keyword | 關鍵字，會顯示在npm中，方便別人搜索 | |
| author | 作者 | |
| license | 執照 |
確認后會發現文件目錄內多出來一個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 <update_type>” 命令
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>自動改變版本
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/jquery@3.2.1/dist/jquery.min.js