实现一个自己的日志处理库并发布到npm

前言

• 不折腾的前端不是一个好的前端，最近在搭建公司内部工具以及组件库，使用 npm 进行管理，所以学习一下如何创建一个属于自己的 JavaScript 库，并发布成 npm 模块。

步骤

• 创建账号

点击进入 npm 官网 右上角进行注册

• 创建项目

一路回车或者根据内容填写相关信息后，项目就创建好了。

package.json内容如下:

• 新建 index.js 文件

(function (root, factory) {
    'use strict';
    if(typeof define === 'function' && define.amd){define('log', [], factory);
    }else{root['log'] = factory();}
})(this ? this : window, function(){

    'use strict';

    const OFF = Number.MAX_VALUE;

    const DEBUG = 10;

    const INFO = 20;

    const WARN = 30;

    const ERROR = 40;


    function LogUtil(){
        this.consoleLog = window.console;
        this._level = OFF;
    }

    LogUtil.prototype.setLevel = function(level){if(!level){return;}
        level = String(level).toLowerCase();
        if(level === 'info'){level = INFO;}else if(level === 'warn'){level = WARN;}else if(level === 'error'){level = ERROR;}else if(level === 'debug'){level = DEBUG;}else{level = OFF;}
        this._level = level;
    };

    LogUtil.prototype.runLog = function(level, methodName, msg){if(!level){return;}
        var form = [new Date().toLocaleString(), level.toLowerCase(), methodName, msg].join('|');
        if(level.toLowerCase() === 'debug' && this._level <= DEBUG){this.consoleLog.debug(form);
        }else if(level.toLowerCase() === 'info' && this._level <= INFO){this.consoleLog.info(form);
        }else if(level.toLowerCase() === 'warn' && this._level <= WARN){this.consoleLog.warn(form);
        }else if(level.toLowerCase() === 'error' && this._level <= ERROR){this.consoleLog.error(form);
        }
    };

    return LogUtil;
});

到这里一个简单的包就创建好了。
如果想再完善一下的话，还可以在包根目录下创建 README.md 文件，里面可以写一些关于包的介绍信息，最后发布后会展示在 NPM 官网上。

发布 npm

使用终端命令行
如果是第一次发布包，执行以下命令，然后输入前面注册好的 NPM 账号，密码和邮箱，将提示创建成功

npm adduser

如果不是第一次发布包，执行以下命令进行登录，同样输入 NPM 账号，密码和邮箱

npm login

注意：npm adduser 成功的时候默认你已经登陆了，所以不需要再进行 npm login 了

接着先进入项目文件夹下，然后输入以下命令进行发布

npm publish

提示如下错误，需要去 npm 官网先验证管理员邮箱

后重新发布

说明已经成功

使用

• 添加项目依赖

npm install log-util

• 初始化

// 初始化 LogUtil 对象
const log = new LogUtil();
// 设置默认等级
const level = 10;
// 使用等级
log.setLevel(level);

• 具体使用

log.runLog('warn', 'init', 'this is warn log');
log.runLog('info', 'init', 'this is info log');
log.runLog('debug', 'init', 'this is debug log');
log.runLog('error', 'init', 'this is error log');

总结

• 第一次发布 npm 包，并简单封装了一个 console.log 工具库
• 文章首发于实现一个自己的日志处理库并发布到 npm