边喝热水边学Vue源码之一--语法检查工作之flow

youwh

Flow 的了解和使用

由于javaScript属于弱语言，没有强制的类型检查，所以在运行的过程中很容易会出现bug，所以语法检查是很有必要的，flow是js中的一个语法检查工具，基本两大功能类型推断和类型注释。与flow类似的工具还有TypeScript，至于为甚选择flow好像和Babel与Eslint有关。

flow安装指令

npm i -g flow-bin

flow 配置

flow init 在目标目录下创建.flowcofing文件
将各种需要的js文件放在相应的分类下面

[ignore]
[include]
[libs]
[lints]
[options]
[strict]

运行flow，检查语法

就是在.flowcofing的同级目录下运行flow指令。

类型推断

所在目录 \fow-test\index.js

// @flow
function Hello(num) {
    return 2 * num
}

Hello("ok")

这里应该是报错的，我这运行居然是 No errors！ 打脸

PS D:\Desktop\vue笔记\代码\flow-test> ls
 目录: D:\Desktop\vue笔记\代码\flow-test
Mode                 LastWriteTime         Length Name
----                 -------------         ------ ----
-a----         2023/11/6     19:31             69 .flowconfig
-a----         2023/11/6     19:41            291 index.js

PS D:\Desktop\vue笔记\代码\flow-test> flow
No errors!

类型注释

//@flow 

function add(x: number, y: number): number {
    return x + y
}

add('hello', 11)

运行flow同样显示没有错误，算了知道是什么意思就行了，以后有空再来纠错把。

原因分析一：

可能是所在目录不对，但我在上级目录下运行flow报错了，说明需要在.flowconfig的同级目录下才有效

PS D:\Desktop\vue笔记\代码> flow
Could not find a .flowconfig in . or any of its parent directories.
See "flow init --help" for more info

原因分析二：

可能与所使用的node的版本有关，但这个可能需要更新node，暂时不想处理太过复杂

PS D:\Desktop\vue笔记\代码> node -v
v12.18.2

先去取快递了，希望邮政没有关门