Java如此火爆，作为一个前端开发者或者前端初学者，发布一个官方可用的Javascript模块对我来说应该会成长很多。下面通过一个简单的Javascript模块filesize.js来介绍github、travis-ci、npm的结合使用。一、目标概述本文将以filesize.js作为介绍。这是一个非常简单的js库，总共不到20行代码，但是功能齐全，可以用于生产。其实npm上有很多模块，简单到几行代码。首先发布一个js模块，代码必须在必要的时候开源，所以必须使用Github作为代码管理。不开源能发布到npm吗？当然可以，但是npminstall拿到之后，就是你的源码了。发布一个js模块需要别人使用。好的测试是必不可少的（很多项目都有下图绿色的小图标），所以你需要为你的项目写一个完整的测试用例（testcase），然后使用Github上的第三方ci工具来执行，travis-ci是最常用的之一。代码测试没有问题后，就可以用npm发布模块了。我们用filesize.js实现的效果是这样的：直接npminstallfilesize.js安装下载即可。下面介绍使用说明。2.Github项目初始化首先在Github上创建一个项目。注意项目的名称。名字最好和后面npm发布的模块名一样（npm模块的名字不能和别人已经发布的名字重名）。后面关于Github，如果提交代码，请自己找其他文章学习。需要强调的是：注意完整的README.md文档，可以先文档化，这样在写代码之前就可以想好自己模块的API方法。可以尝试先写测试用例（testfirst），当然不是强制的，提前写好用例，如果测试跑不起来其实还是挺费时间的。注意代码结构。对于js模块代码，一般是：package.json是npm模块相关的配置；glupfile.js是glup的配置文件，我这里主要用来压缩代码；README.md文件说明；.gitignore忽略git文件和目录进行版本管理（所有不相关的不上传git）；.travis.ymltravis-ci配置文件，后面会介绍。3.Javascript模块&npm一个js模块，有一个package.json文件。这是严格要求的json格式。凡是不符合要求的都会在执行npm命令时报错。例如filesize.js文件的内容如下：比较重要的有name/officialName、keywords、devDependencies、dependencies、scripts、main、version；name：npm发布后的名称，一般与前面提到的github项目名称一致，并且不能与已有的npm模块重命名；keywords：npm模块的关键字，用于npmjs.com上的搜索；devDependencies：开发依赖，比如glup压缩混淆，单元测试用的tape，静态代码检查用的jshint；这些是开发过程中需要的依赖，非开发环境不需要安装；dependencies：模块的依赖库，当用户使用你的模块时，也会安装下载；filesize.js模块非常简单，没有依赖关系。scripts：配置一些指令，比如：npmrunlint、npmruntest、npmrunbuild：代码检查、测试用例执行、构建压缩库main：这是package.json中很重要的配置，flag就是指这个module入口在哪里；version：模块的版本，每次发布，比如保证版本不一样。除了这些配置之外，package.json还有其他更多的配置。您可以搜索并了解它们。一般有了这些配置项就够了，就可以使用npmpublish来发布模块了。但是，在我们发布之前，我们需要做一些持续集成和单元测试，以保证代码的正确性和稳定性。这就是travis-ci的使用。4.访问travis-ci持续集成什么是持续集成？简单来说，就是尽早验证代码的正确性（即测试）。然后每次把代码push到github上，我们就运行测试用例。这个是不是很快，很早，也就是持续集成，对于一些简单的js模块，我们做一些简单的单元测试就够了。在github上创建项目后，可以打开https://travis-ci.org/，使用Github授权登录，然后在Account菜单中勾选需要连接travis-ci的项目，如图下图：如果看不到新建的工程，可以在右上角刷新一下。开启后travis-ci会hook你的gitpush命令，然后根据你项目中的.travis.yml配置文件执行npmtest（npmruntest的简称）进行测试，并抓取测试结果进行判断测试用例执行的成功与否。比如filesize.js的.travis.yml配置如下：表示在nodejs环境下执行，两个不同的大版本执行如下。一般可以选择4.x版本。然后每次推送代码后，都会自动触发ci任务，如下图所示：然后你就可以把这个绿色的小图表放在你的README.md文件中了。5.发布发布项目创建，package.json配置，代码编写，文档齐全，ci执行无误，即可发布。如何发布非常简单。如果你没有https://www.npmjs.com/的账号，注册一个就可以了，和一般的网站注册没什么区别。有了账号后，在项目代码的根目录下，执行：npmpublish控制台会要求你输入npmjs网站的邮箱和密码，输入即可，然后等待出现发布成功，通常：filesize.js@1.0。1就用这种格式的字符串，然后去npmjs官网试试看。6.其他如果你做了一个有用的、有创意的模块，你可以为你的模块做一个简单、酷炫的首页，展示使用情况和API接口。本文举例的项目filesize.js是一个超级大轮子，就是为了写这篇文章而生的。当然，用户也可以开发生产环境。最后安利一下我的Github主页：https://github.com/hustcc，ID是hustcc，因为我是huster，之前刚好注册了hust.cc域名，所以才有了这个githubid。有什么轮子：莆田浏览器插件：Chrome浏览器插件-打开莆田医院网站，发出警告提醒，显示医院信息（莆田系在浪潮中做的，用的人还蛮多的）.timeago.js：timeago.js是一个微型（~1.7kb）库，用于使用***timeago语句格式化日期。例如：“3小时前”。Nodependency&localization&tiny.echarts-for-react:baiduEcharts(v3.0)componentsforReactwrapper。一个简单的echarts(v3.0)反应包装器。本人后台开发，最近在前端阶段开发，深Github，车轮爱好者。
