资讯专栏INFORMATION COLUMN

记录一个 npm 包的开发 -- smms

zhangfaliang / 2127人阅读

摘要:第一步初始化一个包然后按提示输入等信息就可以了。第三步发布注册帐号,已注册的请忽略。,装逼完毕,这样就完成了一个简单的包的开发和发布。执行添加文件,排除需要排除的文件,例如和等。

其实主要想写一个图床网站的上传方法,顺便记录一次 npm 包的开发。

第一步、 初始化一个 npm 包
mkdir upload-img && cd upload-img
npm init

然后按提示输入 package nameversiondescription 等信息就可以了。
初始化完会在当前目录生成一个 package.json 文件,熟悉 现代PHP 的应该都知道,这个文件跟 composer.json 的作用是一样的,都用于描述这个项目的各项信息,包括依赖和脚本等。

第二步、开始编码

新建 index.js 文件,开始编码。

默认的入口文件是 index.js ,当然你可以在 package.json 随意更改入口文件。

/*!
 Copyright (c) 2017 96qbhy.
 Licensed under the MIT License (MIT)
 */
/* global define */

(function () {
    "use strict";

    var axios = window.axios || require("axios");

    function uploadImg(file) {
        var data = new FormData();
        data.append("smfile", file);
        data.append("ssl", true);
        return axios.post("https://sm.ms/api/upload", data).then(data => data.data);
    }

    if (typeof module !== "undefined" && module.exports) {
        module.exports = uploadImg;
    } else if (typeof define === "function" && typeof define.amd === "object" && define.amd) {
        // register as "uploadImg", consistent with npm package name
        define("uploadImg", [], function () {
            return uploadImg;
        });
    } else {
        window.uploadImg = uploadImg;
    }
}());

然后基本套路走一发, 代码就那么多。

实际代码已更新,最新的代码请移步该项目的 github仓库。
作为一个开源项目,一个好的 readme.md 必不可少,此处我省略了 readme.md 的书写,因为太多了。

第三步、发布

注册 npmjs 帐号,已注册的请忽略。

执行 npm adduser ,按提示输入 username 和 password 以及 email。

执行 npm publish

OK,装逼完毕,这样就完成了一个简单的 npm 包的开发和发布。

第四步、添加到 github 仓库

github 创建仓库。

执行 git init,添加 .gititnore 文件,排除需要排除的文件,例如 node_modules.idea 等。

添加远端仓库 , git remote add origin {仓库地址}

add + commit + push

该项目我托管在 github , 地址是 https://github.com/96qbhy/smms
sm.ms 是一款免费的图床网站,smmssm.ms 的 js 上传插件 。

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/89260.html

相关文章

  • Nodejs之npm&package.json

    摘要:在终端输入会询问的各种信息,从而确认。这意味着,所有通过安装的包都可以在终端以命令方式运行,例如,等。用于检查模块是否过时并列出。文件在运行后会生成文件,该文件用于记录项目中所用到的依赖以及项目的配置信息比如名称版本许可证等。 一直以来,作为前端开发,在公司都是先写好页面,然后再跟后端合作,将数据填入前端页面中,但是偶尔自己闲来无事,也会看一些框架什么的,然后利用框架做个单页面应用啊,...

    atinosun 评论0 收藏0
  • 使用NPM

    摘要:另一方面,这样做也无法支持不同项目使用不同版本的。我们可以换一个源,即把服务器换到国内,例如淘宝的源运行下面的命令即可切换淘宝源的配置被存储在,你可以随时改。安装方法使用方法切换源等见链接 Nodejs生态圈很强大,第一个原因就是NPM,因为全球有无数的程序员在NPM中贡献了自己的力量。 为了避免造轮子,我们有时候会用到其他人的劳动成果,比如一些优秀的框架,比如Express,我们直接...

    wanghui 评论0 收藏0
  • 如何设计npm包的开发和发布流程

    摘要:所以此版本号在这里的作用并不是用来区分版本的,小版本号才是真正用来做版本区分的,那么在引用这个就要这么来控制版本号,举个栗子锁定大版本号和小版本号,不管我们开发过程中提交了多少次,我们引用都是最新的。 最近在把公司内部用的一个库发布到内网的npm私服上,仅仅是发布的话是比较简单的,但这个库是由多个人一起维护的,而且npm私服只有一套,所以生产环境和开发环境,用的是同一个,那么,我们的需...

    qieangel2013 评论0 收藏0
  • npm常用命令集合

    摘要:简介,通常称为包管理器。的背后,是基于的一个数据库,详细记录了每个包的信息,包括作者版本依赖授权信息等。它的一个很重要的作用就是将开发者从繁琐的包管理工作版本依赖等中解放出来,更加专注于功能的开发。 0 NPM简介 NPM(node package manager),通常称为node包管理器。顾名思义,它的主要功能就是管理node包,包括:安装、卸载、更新、查看、搜索等。npm的背后,...

    Kahn 评论0 收藏0
  • 生成自己的js工具包,包括打包webpack、测试mocha、生成文档jsdoc、发布npm包的操作

    摘要:包说明包实际是一个存档文件,即一个目录直接打包为或格式的文件,安装后解压还原为目录。完全符合规范的包目录应该包含如下这些文件包描述文件。用于存放单元测试用例的代码。 keepsmiling说明 一些常用的函数集合,主要用到的技术如下: ES6的包处理方式; webpack打包方式; BDD测试用例,只写了部分; 使用jsdoc生成注释文档; 你用eslint优化代码格式; 主...

    Code4App 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<