在npm上发布自己的包

一、为了方便创建项目，需要安装vue-cli, 使用npm 安装！

使用命令vue init webpack-simple bc_utils or vue init webpack bc_utils, bc_utils 为项目名称！webpack-simple 适用于小型项目，中大型项目使用webpack!

二、初始化项目并上传至git!

git 创建好仓库
mv bc_utils bc_utils1 因为本地与git项目重名，先改一下名字。
git clone ... 捡出空仓库
将本地项目的文件拷贝到仓库中。
cp bc_utils1/. bc_utils
将所有文件添加至git
- git add .
- git commit
- git push
打个响指，ok了！

三、发布

1. 查看已经登录的npm 账号

npm whoami
如果提示

npm ERR! code ENEEDAUTH
npm ERR! need auth this command requires you to be logged in.
npm ERR! need auth You need to authorize this machine using `npm adduser`

说明还未登录账号！

2. 登录账号

登录账号之前先查看一下npm的源，有些同学已经将源改为淘宝的，发布时，先改回npm默认的来
npm config get registry
如果显示https://registry.npmjs.org/则正确，否则
npm config set registry https://registry.npmjs.org/

接下来~
npm adduser
要求输入

Username: xiaolin
Password: bc88888
Email: [email protected]

只是举个例子：等到提示Logged in as xiaolin on https://registry.npmjs.org/. 这个时候就是成功登录了！

3. 要发布的组件

npm publish

npm ERR! publish Failed PUT 403
npm ERR! code E403
npm ERR! you must verify your email before publishing a new package: https://www.npmjs.com/email-edit : bc_utils

这种情况下要先验证账号！

{
"name": "bc_utils",
  "description": "baichuan's tools!",
  "version": "1.0.0",
  "main": "index.js",
  "author": "chelin ",
  "license": "MIT",
  "private": false,
  "scripts": {
    "dev": "cross-env NODE_ENV=development webpack-dev-server --open --hot",
    "build": "cross-env NODE_ENV=production webpack --progress --hide-modules"
  },
  "dependencies": {
    "vue": "^2.5.11"
  },
  "browserslist": [
    "> 1%",
    "last 2 versions",
    "not ie <= 8"
  ],
  "devDependencies": {
    "babel-core": "^6.26.0",
    "babel-loader": "^7.1.2",
    "babel-preset-env": "^1.6.0",
    "babel-preset-stage-3": "^6.24.1",
    "cross-env": "^5.0.5",
    "css-loader": "^0.28.7",
    "file-loader": "^1.1.4",
    "vue-loader": "^13.0.5",
    "vue-template-compiler": "^2.4.4",
    "webpack": "^3.6.0",
    "webpack-dev-server": "^2.9.1"
  }
}

小提示： private这个字段一定要设置为false哦~
首先大家理解一下package.json 中 main字段的意思。
main这个字段只有发布的时候，才会用到，平时可以删掉！ main的值是包里面你要发布的文件路径。

比如bc_utils文件夹下有个index.js!

const  name = 'xiaolin';
export default name;

那么安装完包之后，引用：

import bc_utils from 'bc_utils';

那么bc_utils 的值就是字符串'xiaolin'
理解其中原理了么！！！

在npm上 发布自己的包