【手把手带你撸一个脚手架】第五步, 撸完收工

系列文章:

拿到 git 项目信息是重要的一个环节. 然而, 只能拿到信息不能下载下来, 你这脚手架有个🔨用.

2018-11-16-18-03-58

这一节, 我们就开始吧 git 项目下载下来. 并且把完成的代码发布到 npmjs.com 上, 掌握核心科技, 服务全球码农 😂

首先安装依赖 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, 推荐小伙伴们研究一下官方文档

优化 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('下载代码失败...');
}

增加了向用户询问项目开发目录和调用代码下载功能的逻辑. 至此, 我们已经可以正常的下载模板代码啦.不信试试 ^_

success

现在的代码 github已经实现了代码库下载功能, 但是细心的小伙伴不难发现, 代码只能下载到脚手架的项目目录下这是搞什么鬼, 难道是所有的项目都要在脚手架项目下开发? 当然不是. 接下来我们就把我们的脚手架发布到npmjs.com上.

将代码发布到 npm 上

首先, 创建 npmjs 账号, 这个我这里就不说了吧, 硕大的 Sign up 摆在了首页右上角, 这一波, 你不会算(ping)我(lun)输(qu) 😄
其次, 登录 npm 官网, 验证账号没有问题
再次, 把 npm 镜像替换为官方镜像 重点要考
```
npm config set registry http://registry.npmjs.org
```
当然, 替换成官方镜像会很慢很慢, 这里我有一个建议那就是---耐心等待.极客小伙伴们也可以在发包完成后执行下面的语句, 把镜像替换为淘宝镜像速度快的飞起.
```
npm config set registry https://registry.npm.taobao.org
```
最后, 来一把 npm publish 结果如下图:

2018-11-16-21-41-07

没有任何意外的报错了, 但是通过看报错信息, 这是要让我们登录还给出了登录的命令, npm 的设计还是蛮够意思的 ^_

2018-11-16-21-44-06
根据报错信息, 执行 npm adduser

2018-11-16-21-48-05

这里给大家分享一下, 如果没有改镜像地址的话, 就会的在登录的时候报这个错.

2018-11-16-21-49-33

正常的登录操作是这个样子的 ^_
最后, 这次是真的最后, 成功登录完成的最后, 我们再次执行 npm publish 结果如下图:

2018-11-16-21-51-13
通过浏览器访问 npmjs.com 并登录, 按照如下所示的方式就可以找到我们刚刚上传的代码包啦 😄
最后一步, 验证成果....
- 命令行执行 npm i learn-cli -g 全局安装 learn-cli
- 下来的步骤如图:
  
  yanzheng123432

到目前为止, 初级脚手架开发已经完成, 如果有小伙伴又任何疑问,请评论区和我交流喲.

2018-11-16-22-06-10

后记

之前工作中业务繁杂, 各种逻辑需要写各种轮子需要抄, 结果需求无限, 但是脑容量有限, 所以就存在今天写了很牛逼的代码, 明天忘了怎么写的啦,这个迭代搭建了一套很好的开发模板, 下次迭代还要重新搭建. 各种操蛋配置(webpack 我没说你 😄). 反反复复很没意思, 所以就萌生了搞一个脚手架的想法, 一次配置, 一家公司周期内有效. 很好使 ^_

learn-cli v0.0.2 已经能满足大部分需求, 但是还存在不少可以优化的地方, 比如没有 readMe, 可以一次 download 把项目模板直接放在本地, 以后初始化项目直接从本地拷贝模板等等等等, 毕竟学无止境, 但时间有限, 我也欢迎小伙伴们的 PR, 让我们一起来搞一款我们喜欢的也是我们自己的脚手架

第一次写系列文章, 结果一写就停不下来了 😄. 接下来计划写一个接口测试工具系列. 就是那种常见的 http 接口测试工具. 也是我很久以前就答应一个很好很好的小伙伴一起学习的一个项目.

技术选型:

前端: vue.js

后端: java

后端有 node php python 为啥要用 java 呢? 哈哈因为前几种我都会啦 ^_, 欢迎小伙伴们和我一起学习 here we go

2018-11-16-22-24-29