继续浏览精彩内容
慕课网APP
程序员的梦工厂
打开
继续
感谢您的支持,我会继续努力的
赞赏金额会直接到老师账户
将二维码发送给自己后长按识别
微信支付
支付宝支付

搭建自己的脚手架-优化篇1

codexu
关注TA
已关注
手记 8
粉丝 6
获赞 35

几个月前写了一篇《搭建自己的脚手架—“优雅”生成前端工程》,这篇文章介绍的都是搭建脚手架的基本功能,从这篇起,我会将一些可以优化的地方做些总结,欢迎大家一起讨论,为自己做一个更完美的脚手架。

先贴上我自己的脚手架工具x-build-clihttps://github.com/codexu/x-build-cli,在此记录和分享一些遇到的坑和总结的经验。

更好的视觉体验

以@vue/cli举例,当输入vue create [name]后,整个终端好像是翻到新的一页。

或者通过npm i -g x-build-cli & x init使用我的脚手架体验一下。

总之就是看起来很舒服,为了让我自己的脚手架页可以有这种体验,我阅读了@vue/cli的源码。

实现原理

通过nodejs api即可实现,获取终端的高度,输出n个空行,然后将光标移动到左上角_

代码

// clearConsole.js
const readline = require('readline');

const clearConsole = function () {
  if (process.stdout.isTTY) {
    const blank = '\n'.repeat(process.stdout.rows)
    console.log(blank)
    readline.cursorTo(process.stdout, 0, 0)
    readline.clearScreenDown(process.stdout)
  }
}

exports = module.exports = clearConsole;

API文档

process.stdout.rows可以获取当前终端的高度(行)

readline (逐行读取)

打开App,阅读手记
0人推荐
发表评论
随时随地看视频慕课网APP