你剛剛完成自己第一個javascript庫的開發，同時你認為它可以幫助到其他人。你已經聽到人們讨論“開源運動”或“github履歷”，但你在共享軟體這方面上仍然是個新手。
讓你電腦上的源代碼能夠得到别人的信任，并且在他們自己的項目中使用你的庫，你需要完成幾個重要的步驟。這篇文章就是圍繞這一過程來組織。
庫檔案的原來的樣子
讓人們使用你的代碼的第一步是，讓你的代碼在網上可用！當今托管代碼流行的地方是github，本指南将使用它，但是你也可以使用任何你熟悉的托管網站。
<a target="_blank"></a>
如果你還沒有一個github賬号，把這篇文章先放放，去建立一個。如果有一個？很好！現在來建立一個新的倉庫。
我們的新倉庫
這時，您應該有一個不錯的倉庫，裡面都是你寫的代碼。拍拍自己的後背，慶祝一下你的第一個開源項目。做到這一步，現在請豐富你的readme.md檔案。這樣人們可以知道項目用途。
初始化狀态的倉庫
想象你是無辜的 javascript 程式員先生或女士。你偶然發現這個倉庫。你認為，”嘿，這填補了我的一個需求!“作為一個javascript開源社群的成員，你需要知道有一些開放源碼項目的品質标準。除非它符合這些标準，不然你不可能使用這些代碼。
讓你的代碼符合這些标準！
與javascript社群特别相關的兩個标準是依賴管理和測試。
當你的項目依賴于外部庫或子產品，你需要一個簡單的方法來管理這些依賴關系。當然，你可能隻是簡單地複制并粘貼另一個庫的源碼到你的項目源碼，但這很難處理版本變更和確定你的依賴關系的準确性。這就是為什麼依賴管理器可以使你變得更輕松。它允許使用者調用’install[library]‘，來擷取所有依賴項庫的最新版本或他們的代碼所依賴的任何其他庫。
在javascript領域，有一個流行的依賴管理器 npm。這篇文章将使用npm作為依賴管理，但是你可以使用其他任何你覺得合适的工具。
首先，你需要使用指令“npm init”來建立一個新的npm項目。最好猜猜這些配置選項，你可能會改變其中的一些。
如果你看看backbone.freeze的配置選項，您将看到兩個重要的事情。第一個是許可證，回憶我讓你在上面思考的有關許可證的事項？這就是填寫許可證的地方。
同時，你會發現有一個測試指令。您現在可以忽略，或者寫上“gulp test”——我将馬上解釋它的含義。
現在您已經準備好去測試。
測試是讓使用者看到你的庫是實際如何工作的一種簡單方法，同時能讓使用者信任你的代碼能做到你所聲稱能做的事情，即使是邊界情況。是以讓我們為你的插件編寫一些測試!
首先，你需要設定将用來編寫測試的工具。本教程将使用以下:
<a href="http://mochajs.org/" target="_blank">mocha</a>
<code>npm install--save-dev mocha chai</code>
現在你有npm，你準備安裝它們。
(mocha是一個javascript測試架構。chai是一個javascript預測庫，對測試很有用)。
在你的目錄變得混亂之前(新的package.json和node_modules目錄之間，你可能感覺有點擁擠)，是時候遵循标準的約定并移動你的源代碼到“src”目錄了。
此外，您将使用另一個額外的組織方式，建立一個名為“spec”的目錄，在這裡面你将放置所有的測試。
確定你所有的測試都可以使用chai，你需要在spec目錄中建立一個“setup.js”檔案。在該檔案中，您需要設定chai
<code>'use strict';</code>
<code>var chai = require('chai');</code>
<code>global.expect = chai.expect;</code>
你可通過輸入“mocha spec/ *.js”來檢驗以上是否成功，可以看到測試運作成功(包含0個測試)。
花一些時間來編寫測試。它們都應該放在spec目錄中。
…都做完了嗎？好。現在，當你再次運作“npm test”指令，你應該看到，所有的測試用例都在運作，且通過。(如果它們沒有通過，修複之後再繼續！)
既然你已經做完了，把新代碼上傳到github。
大多數javascript開發人員使用某種自動化工作流，使編寫和運作測試的過程更容易一些。有幾種常用的工具，但是這篇文章将使用 gulp。你在本教程中會用它來幹幾件事，現在它将幫助啟動測試。首先，安裝 gulp 和 gulp mocha 插件。
<code>npm install--save-dev gulp gulp-mocha</code>
你需要在父目錄中添加一個gulpfile.js，它包含以下行:
<code>require('./gulp');</code>
該檔案表示，它将監視一個名為“gulp”的目錄，是以你需要建立它。在這個目錄中，建立一個index.js檔案，它是被gulp執行所有javascript檔案的入口點。然後建立一個名為“task”的檔案夾——index.js将引用該目錄下的所有檔案，以便gulp知道它們。
<code>'use strict';var fs = require('fs');</code>
<code>var tasks = fs.readdirsync('./gulp/tasks');</code>
<code>var gulp = require('gulp');tasks.foreach(function(task) {</code>
<code>require('./tasks/' + task);</code>
<code>});</code>
現在進行最後一點複制-粘貼。在你的task目錄，建立一個測試任務，它将啟動所有測試：
<code>var gulp = require('gulp');</code>
<code>var mocha = require('gulp-mocha');gulp.task('test', function () {</code>
<code>return gulp.src(['./spec/setup.js', './spec/**/*.spec.js'], { read: false })</code>
<code>.pipe(mocha({ reporter: 'spec' }));</code>
您會注意到test.js這個gulp task引用了spec目錄，并加載了setup.js檔案。
在這之後，你的目錄應該像這樣:
是否記得我在文章中提到的npm初始化步驟“gulp test”？這裡是它存在的地方。使用你喜歡的文本編輯器打開package.json，并確定它有這樣一段腳本:
<code>"scripts": {</code>
<code>"test": "gulp test"</code>
<code>},</code>
package.json 中的這一行，告訴 npm 如何執行你的測試。
這是一個很好的測試，以確定你在正确地做所有事：在你的項目目錄，運作“npm test”，并確定你看到相同的測試輸出。
既然您已經有一個全面的測試套件，那您需要一種方法來向使用者保證，你釋出的新版本不會破壞任何功能。這就是持續內建。“持續內建”意味着将不斷測試代碼。(或表示代碼不斷更新，在每一次送出。)
這裡有很多工具可以使用。這篇文章将使用一個非常棒工具，名為travis ci，它為任何公共的github項目提供免費的持續內建。
你需要做的第一件事是添加一個travis-ci配置檔案到你的倉庫。這個檔案會告訴travis你的項目語言。在那裡，travis可以判斷需要執行的指令，并運作你的測試。
<code>language: node_js</code>
你可能會想在github頁面嵌入建構資訊，這樣一個感興趣的使用者一眼就可以看到，你的代碼是穩定且可信賴的。如果你點選倉庫名稱旁邊的圖檔(在頂部，顯示為“buid|passing”)應該會看到一個彈出框。選擇“markdown”并複制文本框的内容。你可以粘貼到你的readme.md檔案，并更新到github。如果你做對了，github頁面現在看起來應該像這樣:
注意，你是如何一眼就可以看出這是通過所有的測試
幸運的是，有一個叫做webpack庫，使所有這些變的簡單！確定你的庫是打包的，這樣它對每個人都可用，無論他們使用什麼子產品系統(或不使用，視情況而定)。你需要一個名為“del”的工具來删除檔案。
<code>npm install--save-dev gulp-webpack del</code>
這裡說說打包過程是如何工作的：你需要建立一個名為“dist”的目錄(釋出的簡稱)，這是“相容”版本庫的存放位置。你需要一個gulp任務來建立它，以及一個gulp任務來清理目錄。讓我們先從清理任務開始。
<code>'use strict';var gulp = require('gulp');</code>
<code>var del = require('del');gulp.task('clean', function (cb) {</code>
<code>del([</code>
<code>'dist'</code>
<code>], cb);</code>
這不是那麼糟糕！您隻需建立一個任務，删除dist檔案夾。現在看看dist。
<code>var webpack = require('gulp-webpack');</code>
<code>gulp.task('dist', function () {</code>
<code>return gulp.src('src/[library entry point (i.e. backbone.freeze.js)]')</code>
<code>.pipe(webpack({</code>
<code>output: {</code>
<code>filename: '[name of final file (i.e. backbone.freeze.js)]',</code>
<code>librarytarget: 'umd'</code>
<code>externals: {</code>
<code>backbone: {</code>
<code>amd: 'backbone',</code>
<code>commonjs: 'backbone',</code>
<code>commonjs2: 'backbone',</code>
<code>root: 'backbone'</code>
<code>underscore: {</code>
<code>amd: 'underscore',</code>
<code>commonjs: 'underscore',</code>
<code>commonjs2: 'underscore',</code>
<code>root: '_'</code>
<code>devtool: 'source-map'`</code>
<code>}</code>
<code>}))</code>
<code>.pipe(gulp.dest('dist'));</code>
在括号部分内，分别填寫庫入口點的檔案名和輸出檔案的最終名。你可以通過在指令行運作“gulp dist”和“gulp clean”來確定一切正常運作，并檢查檔案夾和檔案是否都建立或者移除。
注意：dist檔案夾在dist任務後出現，clean任務後消失。
現在你的庫馬上可以廣泛使用了！剩下要做的唯一一件事是…
想想前面的步驟，您通過依賴管理設定您的項目？不久後的某一天，某天真的javascript程式員先生或女士，能夠在她喜歡的依賴管理工具下輸入 ‘install [你的庫]’，它就工作了！
在以下步驟，你會将代碼被納入公共倉庫，并使用這兩種常用的依賴管理工具，使其可用于所有其他開發人員。
bower和npm都依賴于配置檔案。(npm的package.json。)因為你沒有一個bower配置檔案，您需要做的第一件事是寫一個gulp任務來為你生成一個。你可能會問“為什麼?“。因為你不想維護兩個不同的配置檔案。一旦你準備好釋出，您可以通過運作“gulp dist”來為所有部件的釋出做準備。
你需要為此安裝兩個庫。
<code>npm install--save-dev gulp-rename gulp-json-editor</code>
現在你需要準備:
<code>"use strict";</code>
<code>var rename = require('gulp-rename');</code>
<code>var jeditor = require('gulp-json-editor');</code>
<code>var _ = require('underscore');</code>
<code>gulp.task('bower', function () {</code>
<code>return gulp.src('./package.json')</code>
<code>.pipe(rename('bower.json'))</code>
<code>.pipe(jeditor(function (json) {</code>
<code>return _.pick(json, [</code>
<code>'name',</code>
<code>'version',</code>
<code>'description',</code>
<code>'main',</code>
<code>'keywords',</code>
<code>'author',</code>
<code>'license',</code>
<code>'dependencies'</code>
<code>]);</code>
<code>.pipe(gulp.dest('.'));</code>
修改gulp/tasks/dist.js中gulp.task處，包含以下代碼(['bower']):
<code>gulp.task('dist', ['bower'], function () {</code>
這確定了dist運作時，bower任務參與了。
現在您需要釋出代碼到這兩個倉庫。首先，你需要為您的庫選擇一個還沒有使用的名稱。搜尋npm registry和 bower registry ，以確定一個你想要的名字沒被使用。(如果被用了，你需要改變package.json。)
在你釋出你的代碼之前，更新您的文檔讓使用者知道如何擷取代碼。添加這些到readme.md(填入庫名)：
<code>#installing</code>
<code>freeze is available on npm and bower as "backbone.freeze"</code>
<code>```</code>
<code>bower install backbone.freeze</code>
<code>or</code>
<code>npm install backbone.freeze</code>
npm釋出很簡單——隻是設定 npm 作者資訊:
<code>npm set init.author.name "your name"</code>
<code>npm set init.author.email "[email protected]"</code>
<code>npm set init.author.url "http://yourblog.com"</code>
<code>npm adduser</code>
輸入 ‘npm publish. /’.
好了！你已經正式釋出在npm !
釋出一個包到bower有點複雜。
首先，在你項目的git倉庫中建立一個标簽。
<code>'git tag -a [version] -m "released [version]"'</code>
…”([version])”是package.json中的目前版本号。
接下來，将該标記上傳github。
<code>'git push origin [version]'</code>
然後用bower注冊您的項目。
<code>'bower register [package name] [git endpoint]'</code>
…”[package name]”是庫的名稱(對我來說，它是“backbone.freeze”)，“[git endpoint]”是github上的.git檔案的url(對我來說，它是“git://github.com/benmanbs/freeze.git”)。
現在庫已經注冊，當你把新的标簽更新到github，它會在bower自動更新。
我編寫的一些腳本，你可能用得上。
腳本需要版本類型(大版本号，小版本号或更新檔号)，在package.json中添加你的版本号，生成一個bower.json和dist，并同時釋出到npm和bower。
本文來自雲栖社群合作夥伴“linux中國”，原文釋出日期：2015-08-10