ora

如果有深入进行过前端构建的,一定会遇到除了 webpack 等构建工具之外的实现前端自动化的过程,比如编译、git 提交、发布一步完成,无需开发者进行多次的指令操作等,那么一般当我们合并这些流程后等待时由于命令行界面就只有我们输入的内容外没有任何的提示而卡在这等待会感觉体验特别差,而 ora 就是为了解决这个问题的,就是我们在客户端界面上发送请求后需要一个 loadding 的动画一样,而 ora 就是让命令行界面有一个spinner旋转动画的效果。

使用方式例子:

1
2
3
4
5
6
7
8
9
const ora = require("ora");

const spinner = ora("npm publish .").start();

setTimeout(() => {
spinner.succeed("成功");
// 或
// spinner.fail("失败");
}, 2000);

ora 方法的入参为开始显示的内容,成功或失败后的入参为结果的内容。

如果没有特殊要求就是那么简单,而且操作的体验效果也很棒。

以下是ora的官方例子

ora 的例子代码

shellJs

就是让我们可以使用 node 的方式,写 shell 脚本,就像平时操作 Linux 上的 shell 一样,

比如 Linux 上,在 temp 目录下生成 test.js 文件:

1
touch temp/test.js

而使用 ShellJs 也可以实现,而且不需要考虑操作系统的问题

1
2
3
const shell = require("shelljs");
const { touch } = shell;
touch("temp/test.js");

效果是一样的

使用 sed 添加 package 版本号

1
2
3
4
5
6
sed(
"-i",
/(version.*:[\W]*)\d+\.\d+\.[\w-]+/,
"$10.1.190",
path.resolve(__dirname, "../../package.json")
);

$1 为匹配中的第一组内容,那么我们可以使用匹配中的组加上替换的版本号,就可以直接对 package.json 的版本进行替换

而 shellJs 中exec是我觉得最有用的方法,因为它可以进行执行的指令,如npm run build

如:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
const shell = require("shelljs");
const chalk = require("chalk");
const ora = require("ora");

const { which, exec } = shell;

function installYalc() {
return new Promise(function (res, rej) {
console.log(`全局安装: ${chalk.green("yalc")}`);
const spinner = ora("install yalc").start();
exec("npm i -g yalc", { silent: true }, function (code, stdout) {
if (code !== 0) {
spinner.fail(stdout);
rej();
} else {
spinner.succeed(stdout);
res();
}
});
});
}

async function hasYalc() {
if (!which("yalc")) {
await installYalc();
return true;
}
}

module.exports = hasYalc;

而 exec 最好是使用异步,否则会卡着终端。

shell 例子

yalc

最好的 link 方法

它的使用很简单,就是全局安装,然后当前项目发布,联调项目 add 就行了,联调完后yalc remove --all

参考资料
yalc github