你是否经常在debug那些简单可避免的bug?可能你给函数传参的时候搞错了参数的顺序,或者本来应该传个Number类型的参数,你传了一个String类型?JavaScript的弱类型是这一类bug的罪魁祸首,静态类型语言中不存在此类bug。Flow就是JavaScript的静态类型检查工具,该库的目标在于检查JavaScript中的类型错误,开发者通常不需要修改代码即可使用,故使用成本很低。同时,它也提供额外语法支持,使得开发者能更大程度地发挥Flow的作用。
一、flow的安装
flow可以直接通过npm或者yarn安装。
这里以npm为例:
npm install --save-dev flow-bin安装完成后在package.json中加入下面的脚本
"scripts": {
"flow":"flow check"
}
同时还要安装babel编译器,将flow的类型检查代码从代码中剥离,转变成正常的js代码
npm install --save-dev babel-cli babel-preset-flow在babel配置文件.babelrc中加入
{
"presets": ["flow"]}
二、flow使用
1、配置flow
npm run flow init生成flow配置文件.flowconfig
[ignore].*/node_modules/.*
.*/test/.*
.*/build/.*
.*/config/.*
[include][libs][options]module.file_ext=.vue
module.file_ext=.js[ignore]:Flow 默认检查项目目录下所有文件,但是有很多文件必定是我们不想检查的,就像 node_modules、build 等目录下的文件,所以我们需要在将这些目录写在 ignore 配置下。[include]:所谓的项目目录其实是 .flowconfig 目录,并不是真正的项目目录,如果我们在这个项目中的某个目录下创建一个 .flowconfig,那么 .flowconfig 所在的目录也会变为一个 Flow 项目。那么,如果我们想对当前 Flow 项目以外的文件或者目录进行检查,需要把它们写在 include 配置项中。[libs]:在项目中,我们可能会用到很多自定义的类型,比如说要记录对象的结构,它可能在每个文件中都会被运用到,我们将其抽取为全局的类型或数据结构,在任何文件都可以使用。为了管理方便,我们将全局类型都定义在一个或多个单纯的目录中统一管理。这里存放的有可能是一个定义好的数据结构,存放的也有可能是根据项目中某个类对应的数据类型。我们将这些文件或目录写在 libs 配置项中,这个配置对于我们使用 Flow 来说很重要。[options]:这里填写对 Flow 项目的一些配置,配置项以key=value的形式,每行写一个。所有的配置见官方文档[lints]:官网中没有提到 lints 相关的配置2、新建一个文件index.js










