实现一个自己的日志处理库并发布到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