【手把手帶你擼一個腳手架】第五步, 擼完收工

時間 2019-11-07

標籤第五收工简体版

原文原文鏈接

系列文章:php

拿到 git 項目信息是重要的一個環節. 然而, 只能拿到信息不能下載下來, 你這腳手架有個🔨用.前端

這一節, 咱們就開始把 git 項目下載下來. 而且把完成的代碼發佈到 npmjs.com 上, 掌握核心科技, 服務全球碼農 😂vue

首先安裝依賴 download-git-repo

npm install download-git-repo -S
複製代碼

擴充 Git 操做類

完善 Git 類的 downloadProject 方法:

downloadProject({ repo, version, repoPath }) {
    return new Promise((resolve, reject) => {
        download(`${this.orgName}/${repo}#${version}`, repoPath, (err) => {
        if (err) reject(err);
        resolve(true);
        });
    });
}
複製代碼

這裏引入了 download-git-repo, 推薦小夥伴們研究一下官方文檔java

優化 command/download.js 文件,

// 向用戶諮詢欲建立項目的目錄
const repoName = [
    {
    type: 'input',
    name: 'repoPath',
    message: '請輸入項目名稱: ',
    validate(v) {
        const done = this.async();
        if (!v.trim()) {
        done('項目名稱不能爲空~');
        }
        done(null, true);
    },
    },
];
const { repoPath } = await this.inquirer.prompt(repoName);

// 下載代碼到指定的目錄下
try {
    downLoadLoad = this.downLoad.start();
    await this.git.downloadProject({ repo, version, repoPath });
    downLoadLoad.succeed('下載代碼成功');
} catch (error) {
    console.log(error);
    downLoadLoad.fail('下載代碼失敗...');
}
複製代碼

增長了向用戶詢問項目開發目錄和調用代碼下載功能的邏輯. 至此, 咱們已經能夠正常的下載模板代碼啦.不信試試 ^_^ node

如今的代碼 github已經實現了代碼庫下載功能, 可是細心的小夥伴不難發現, 代碼只能下載到腳手架的項目目錄下這是搞什麼鬼, 難道是全部的項目都要在腳手架項目下開發? 固然不是. 接下來咱們就把咱們的腳手架發佈到npmjs.com上.python

將代碼發佈到 npm 上

首先, 建立 npmjs 帳號, 這個我這裏就不說了吧, 碩大的 Sign up 擺在了首頁右上角, 這一波, 你不會算(ping)我(lun)輸(qu) 😄webpack
其次, 登陸 npm 官網, 驗證帳號沒有問題git
再次, 把 npm 鏡像替換爲官方鏡像 重點要考github
```
npm config set registry http://registry.npmjs.org
複製代碼
```
固然, 替換成官方鏡像會很慢很慢, 這裏我有一個建議那就是---耐心等待.極客小夥伴們也能夠在發包完成後執行下面的語句, 把鏡像替換爲淘寶鏡像速度快的飛起.web
```
npm config set registry https://registry.npm.taobao.org
複製代碼
```
最後, 來一把 npm publish 結果以下圖:

沒有任何意外的報錯了, 可是經過看報錯信息, 這是要讓咱們登陸還給出了登陸的命令, npm 的設計仍是蠻夠意思的 ^_^
根據報錯信息, 執行 npm adduser

這裏給你們分享一下, 若是沒有改鏡像地址的話, 就會的在登陸的時候報這個錯.

正常的登陸操做是這個樣子的 ^_^
最後, 此次是真的最後, 成功登陸完成的最後, 咱們再次執行 npm publish 結果以下圖:
經過瀏覽器訪問 npmjs.com 並登陸, 按照以下所示的方式就能夠找到咱們剛剛上傳的代碼包啦 😄
最後一步, 驗證成果....
- 命令行執行 npm i learn-cli -g 全局安裝 learn-cli
- 下來的步驟如圖:

到目前爲止, 初級腳手架開發已經完成, 若是有小夥伴又任何疑問,請評論區和我交流喲.

後記

以前工做中業務繁雜, 各類邏輯須要寫各類輪子須要抄, 結果需求無限, 可是腦容量有限, 因此就存在今天寫了很牛逼的代碼, 明天忘了怎麼寫的啦,這個迭代搭建了一套很好的開發模板, 下次迭代還要從新搭建. 各類操蛋配置(webpack 我沒說你 😄). 反反覆覆很沒意思, 因此就萌生了搞一個腳手架的想法, 一次配置, 一家公司週期內有效. 很好使 ^_^

learn-cli v0.0.2 已經能知足大部分需求, 可是還存在很多能夠優化的地方, 好比沒有 readMe, 能夠一次 download 把項目模板直接放在本地, 之後初始化項目直接從本地拷貝模板等等等等, 畢竟學無止境, 但時間有限, 我也歡迎小夥伴們的 PR, 讓咱們一塊兒來搞一款咱們喜歡的也是咱們本身的腳手架

第一次寫系列文章, 結果一寫就停不下來了 😄. 接下來計劃寫一個接口測試工具系列. 就是那種常見的 http 接口測試工具. 也是我好久之前就答應一個很好很好的小夥伴一塊兒學習的一個項目.

技術選型:

前端: vue.js

後端: java

後端有 node php python 爲啥要用 java 呢? 哈哈由於前幾種我都會啦 ^_^, 歡迎小夥伴們和我一塊兒學習 here we go