学习omit.js源码及npm包的发布本文参加了由公众号@若川视野发起的每周源码共读活动，点击了解详情一起参与。

本文参加了由公众号@若川视野 发起的每周源码共读活动， 点击了解详情一起参与。
这是源码共读的第36期，链接：juejin.cn/post/711878…

1，准备

github: github.com/benjycui/om…
npm: www.npmjs.com/package/omi…

把源码clone到本地，安装运行。

npm run start

执行npm run start有如下错误，找不到包不知道为什么找不到？本地执行 npm i storybook-addon-source -D 安装

npm i storybook-addon-source -D

再次npm run start

2，源码

omit.js功能：剔除对象中属性并返回一个浅复制对象。

var omit = require('omit.js');
omit({ name: 'Benjy', age: 18 }, [ 'name' ]); // => { age: 18 }

源码实现

function omit(obj, fields) {
  // eslint-disable-next-line prefer-object-spread
  const shallowCopy = Object.assign({}, obj);
  for (let i = 0; i < fields.length; i += 1) {
    const key = fields[i];
    delete shallowCopy[key];
  }
  return shallowCopy;
}

大致实现过程：

根据目标对象浅复制新对象
遍历需要剔除的属性值，并从新对象中删除该属性
返回新对象

这里使用Object.assign浅复制，该方法在mdn上描述如下：（地址）

Object.assign()

Object.assign() 方法将所有可枚举（Object.propertyIsEnumerable() 返回 true）和自有（Object.hasOwnProperty() 返回 true）属性从一个或多个源对象复制到目标对象，返回修改后的对象。验证下：

（使用ES6的扩展运算符，也可以实现上面浅复制对象。不知库作者为什么没使用(兼容？)。Object spread vs Object.assign）循环可以使用for of，也会简洁些。

const shallowCopy = {...obj};
for (const field of fields) {
    delete shallowCopy[field];
  }

3，npm包上传

发布包到npm，大致有以下步骤：

登录npm官网（www.npmjs.com/），注册一个npm账号
本地确保是npm官网源

npm get registry
https://registry.npmjs.org
// 如果不是上面官网源，请先设置 npm config set registry https://registry.npmjs.org

初始化本地模块 npm init
本地登录 npm login
发布 npm publish

参考：手把手教你创建你的第一个 NPM 包

以上就能把包发布到npm上了。但是想要发布一个靠谱的包，需要把源码放到开源仓库，添加文档说明，规定代码风格，编写测试用例等等，以此保证代码的质量。可以参考omit.js.

omit.js依赖库

  "devDependencies": {
    "@umijs/fabric": "^2.2.2",
    "assert": "^1.4.1",
    "eslint": "^7.4.0",
    "father": "^2.30.21",
    "np": "^6.3.1",
    "rc-tools": "^6.3.3"
  }

umi-fabric

一个包含 prettier，eslint，stylelint 的配置文件合集。

omit中直接使用，可以覆盖扩展，很方便

const base = require('@umijs/fabric/dist/eslint');

module.exports = {
  ...base,
  rules: {
    ...base.rules,
    'no-template-curly-in-string': 0,
    'prefer-promise-reject-errors': 0,
    'react/no-array-index-key': 0,
    'react/sort-comp': 0,
    'import/no-named-as-default': 0,
    'import/no-named-as-default-member': 0,
  },
};

assert

代码测试用例

eslint

检查代码工具，统一编码风格

father

Library toolkit based on rollup, docz, storybook, jest, prettier and eslint.

在项目中用于生成文档，打包编译，测试等，很方便。

    "start": "father doc dev --storybook",
    "build": "father doc build --storybook",
    "compile": "father build",
    "gh-pages": "father doc deploy",
    "prepublishOnly": "npm run compile && np --yolo --no-publish",
    "lint": "eslint .",
    "test": "father test",
    "coverage": "father test --coverage"

np

A better npm publish

标准npm包发布中有很多细节需要注意，比如更改版本号，执行测试，打包，发布，打标签，描述等。np库帮助我们更好实现这些。

"prepublishOnly": "npm run compile && np --yolo --no-publish",

参考：怎么发布 NPM 包（业内的做法）

总结：

了解omit.js实现，了解Object.assign浅复制对象
了解npm包发布流程
了解一些father,np,fabric库的使用等
了解单元测试