flow 是一个javascript 静态检查的工具，由facebook 开发， 使用起来简单，方便。
安装
- 项目初始化
yarn init -y- 编译器安装
yarn add --dev babel-cli babel-preset-flow
配置babel
.babelrc
{
"presets": ["flow"]
}
package.json
{
"name": "my-project",
"main": "lib/index.js",
"scripts": {
"build": "babel src/ -d lib/",
"prepublish": "yarn run build"
}
}
设置 flow
yarn add --dev flow-bin
运行
yarn run flow
备注：需要先执行yarn run flow init简单demo
- 项目结构
├── lib // 输出目录
│ ├── api
│ │ ├── api.js
│ │ └── index.js
│ └── user
│ └── user.js
├── package.json
├── src // flow 源码目录
│ ├── api
│ │ ├── api.js
│ │ └── index.js
│ └── user
│ └── user.js
└── yarn.lock- 代码说明
package.sjon
{
"name": "second",
"version": "1.0.0",
"main": "index.js",
"license": "MIT",
"devDependencies": {
"babel-cli": "^6.26.0",
"babel-preset-flow": "^6.23.0",
"flow-bin": "^0.77.0"
},
"scripts": {
"build": "babel src/ -d lib/",
"flow":"flow",
"i":"flow init",
"start":"node lib/api"
}
}
src/user/user.js
// @flow
// 函数定义
function getinfo(name:string):string {
return name;
}
module.exports={
name:"dalong",
age:33,
get:getinfo
}
src/api/api.js
// @flow
function call(name:string):string {
const user = require("../user/user")
return user.get("dalong")
}
module.exports=call
src/api/index.js
// @flow
const api = require("./api")
console.log(api("dalong"))
- 构建&&运行
yarn build
yarn start- 参考提示
说明
实际使用vscode 需要将系统内部的ts 检查，禁止，同时添加以下插件 ，总的来说还是就表简答，使用比较方便的，
flow-typed 也是一个不错的选择，帮助我们校验三方类库类似ts 的typings参考资料
https://flow.org/en/docs/libdefs/
https://github.com/flow-typed/flow-typed#readme
https://flow.org/en/docs/getting-started/