前言： 针对项目越来越大，js弱类型、动态类型捉襟见肘，导致项目维护成本越来越高，typeScript接入学习成本及vue兼容性等问题，考虑引入flow.js
优点：
静态类型检查，避免类型编码错误
不影响线上代码打包，对线上代码影响小
接入后可仅在需要的文件中使用
项目接入流程如下：
使用yarn、babel的方式，其他方式请参照：https://flow.org/en/docs/install/，安装如下依赖：
yarn add --dev @babel/preset-flow flow-bin flow-typed
2. 安装完成后在项目根文件初始化flow
yarn run flow
3. 在babel.config.js文件中添加：
presets: ['@babel/preset-flow']
4. 在.flowconfig配置文件中配置路径简写
eg：
[options]
module.name_mapper='^@/(.*)$' -> '<PROJECT_ROOT>/src/\1'
5. 配置eslint
yarn add eslint-plugin-flowtype
.eslintrc.js中添加
extends: [
'plugin:flowtype/recommended'
],
plugins: ['flowtype'],
在项目根目录.vscode下的setting.json配置：
"javascript.validate.enable": false // 清除只能在ts文件中编写静态类型语法的错误
6. 相关语法文档：
https://zhenyong.github.io/flowtype/docs/getting-started.html#_
https://segmentfault.com/a/1190000016396411文章来源地址https://www.toymoban.com/news/detail-852205.html
文章来源：https://www.toymoban.com/news/detail-852205.html
到了这里，关于无痛接入flow.js的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！
