flow的简单使用

作者: 木木烈少 | 来源:发表于2016-01-24 01:43 被阅读3191次

Flow 是 Facebook 旗下一个为 JavaScript 进行静态类型检测的检测工具。它可以在 JavaScript 的项目中用来捕获常见的 bugs,比如隐式类型转换,空引用等等。
下面根据官网的介绍,简单说下 flow 的简单使用,更详细高级的功能以及 Flow 的安装方法,可以到官网上查看。

首先,我们需要创建一个简单的项目,如下:
a. 创建目录: mkdir testFlow
b. 进入目录:cd testFlow
接着我们通过 flow init 命令对 Flow 进行初始化。这时我们可以通过 ls -a 来查看目录,发现创建了一个 .flowconfig 文件,有了这个文件,我们就可以通过 check 命令来检测和这个文件同级目录以及子目录上的 js 文件的语法问题了。

查看文件
现在我们可以使用命令:flow check 进行文件的检测了,不过现在没有文件,所以会显示 Found 0 errors。另外,这个命令每次执行都会重新检测所有文件。但是我们在大的项目中,可能只想它 check 新添加的文件或者被修改的文件,Flow 允许你通过 client/server 的架构来启动 Flow 服务器,让它在后台进行文件的监听。方法很简单,一条 flow 命令就能完成 Flow 服务器启动,文件检测,被更改文件的检测,即第一次使用 flow 命令会启动 Flow 服务器并且首次检测文件,再次使用 flow 命令会连接 Flow 服务器并且检测文件,之后使用 flow 命令时将会连接 Flow 服务器并且对修改过的文件进行检测。
如果想停止 Flow 服务器,通过 flow stop 即可。
现在,我们创建一个 js 文件, 输入如下内容:
/* @flow*/

function test(n: number){
  var num = 3;
  return num + n;
}

test('hello');

代码的开头通过 @flow 告诉 Flow 这个文件需要进行类型的检测。下面,执行 flow check 命令进行文件检测。

检测文件
因为我们在定义函数的时候声明了参数 n 是 number 类型,所以在调用处就可以清晰的看到显示的错误情况了。如果我们就想让 String 类型和 number 类型相加怎么办,试试将参数的类型声明去掉会是什么效果呢?如下:
/* @flow*/

function test(n){
  var num = 3;
  return num + n;
}

test('hello');

执行 flow check 命令进行文件检测。

文件检测
这次可以看到,没有报错。现在,假设我们既不想写类型声明,有想让它检测到错误,那又要怎么做呢?这时可以将 @flow 改为 @flow weak,如下:
/* @flow weak*/

function test(n){
  var num = 3;
  return num + n;
}

test('hello');

执行 flow check 命令进行文件检测。

文件检测
从图中可以看到检测出了错误。
如果想让 Flow 检测所有文件,包括文件开始没有使用 @flow 声明的文件,可以使用 flow check --all 命令。
Flow 的功能很强大,想了解更多内容的话官方非常的详细。

相关文章

  • kotlin Flow(一)

    1.什么是Flow ? 2.LiveData 和 Flow 的区别? 3.简单介绍flow 使用 4.channe...

  • flow的简单使用

    Flow 是 Facebook 旗下一个为 JavaScript 进行静态类型检测的检测工具。它可以在 JavaS...

  • Kotlin Flow 一 Flow 的创建和使用

    Flow 和 RxJava 差不多,不过 Flow 是和协程一起使用的 API。 简单的例子 在 Flow 中可以...

  • Kotlin Flow简单使用

    什么是流? 从流的方向来观察,我们称原始数据为上流,对数据进行一系列处理后,最终的数据为下流。从流的属性来观察,我...

  • git flow的使用

    git大家都比较熟悉,下面来简单说说git flow。通过几个简单的使用,来比较一下git flow的方便之处。为...

  • Git 工作流程

    文中内容仅供参考。 Git 工作流程简单介绍了三种广泛使用的工作流程: Git flow Github flow ...

  • Flow(一)—— JavaScript静态类型检查器

    目录 Flow概述 Flow VS. TypeScript Flow安装 Flow使用在文件开头要使用注释在代码中...

  • Markdown Flow 流程图

    Markdown 流程工具和插件很多,这里记录一下简单的Flow的使用 预览 源码 说明 flow 流程图分为两部...

  • Flow(二)—— 简单语法使用

    目录 Flow类型推断 Flow类型注解使用的地方 Flow Type Annotations类型参考网址原始类型...

  • 协程Flow简单使用

    前言 本文是阅读协程Flow的总结笔记。 什么是Flow Kotlin中的Flow API是可以更好的异步处理按顺...

网友评论

  • 蓓蕾心晴:想请教一下 windows是不是不可以直接flow init 命令,安装了flow包,总说找到不该命令……
    小小的说一下:flow chekc --all 最后单词字母写反了
    蓓蕾心晴:@木木少烈 好的 谢谢~~
    木木烈少:https://flow.org/en/docs/install/
    木木烈少:是不是安装的方式不对呢?建议看下官方文档哈

本文标题:flow的简单使用

本文链接:https://www.haomeiwen.com/subject/gvukhttx.html