从零发布一个npm包

如何从零发布一个npm包

1. 注册账号

如果你已经注册过npm包，可以跳过去。
输入命令 npm adduser 根据提示输入 name、password 、email。
输完之后，记得去刚刚登记的邮箱激活一下，不然会无法发布哦。

tips:

• 如果你之前使用的是淘宝源或者公司内部的源，记得切换为 npm 官方源，命令为: npm config set registry https://registry.npmjs.org/
• 如果不确定是否登录过npm，可以使用 npm whoami 查看。

2. 初始化一个简单的项目

我是参考 webpack 创建library 写的。
简单来说就是:

1. mkdir demo && cd demo
2. npm init -y
3. npm install --save-dev webpack lodash webpack-cli
4. 新建一个src 文件夹，添加 index.js 和 ref.json. 他们的内容如下：

// index.js

import _ from 'lodash';
import numRef from './ref.json';

export function numToWord(num) {
  return _.reduce(numRef, (accum, ref) => {
    return ref.num === num ? ref.word : accum;
  }, '');
};

export function wordToNum(word) {
  return _.reduce(numRef, (accum, ref) => {
    return ref.word === word && word.toLowerCase() ? ref.num : accum;
  }, -1);
};

// ref.json

[{
    "num": 1,
    "word": "One"
  }, {
    "num": 2,
    "word": "Two"
  }, {
    "num": 3,
    "word": "Three"
  }, {
    "num": 4,
    "word": "Four"
  }, {
    "num": 5,
    "word": "Five"
  }, {
    "num": 0,
    "word": "Zero"
  }]

1. 新建一个 webpack-config-js 文件,内容如下：

var path = require('path');
module.exports = {
    entry: { index: './src/index.js' },
    output: {
        path: path.resolve(__dirname, 'dist'),
        filename: 'webpack-numbers.js',
        library: 'webpackNumbers',
        libraryTarget: 'umd'
    },
    externals: {
        lodash: {
            commonjs: 'lodash',
            commonjs2: 'lodash',
            amd: 'lodash',
            root: '_'
        }
    }
}

1. 为了编译方便 配置一下 package.json 的build 命令

// scripts 部分

"scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "build": "webpack --config webpack.config.js"
  },

3. 发布

执行
npm run build
npm publish

发布之后可以在 https://www.npmjs.com/ 查找自己发布的包。

4. 常见报错

1. 没有去邮箱验证

1. 当前的版本号已经发步过，在package.json 里更新版本号

1. 仓库名字重复，别人已经发布了，更换package.json 里的name

使用发布的npm包

在其他项目，或者另外的项目
npm install xxx // xxx 是你刚刚发布的包名字
引入

import { numToWord } from 'webpack-number-hqy';

然后就可以使用 numToWord 函数拉