无痛接入flow.js
  qi45EmQmijLD 15天前 30 0
Vue

前言: 针对项目越来越大,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

【版权声明】本文内容来自摩杜云社区用户原创、第三方投稿、转载,内容版权归原作者所有。本网站的目的在于传递更多信息,不拥有版权,亦不承担相应法律责任。如果您发现本社区中有涉嫌抄袭的内容,欢迎发送邮件进行举报,并提供相关证据,一经查实,本社区将立刻删除涉嫌侵权内容,举报邮箱: cloudbbs@moduyun.com

  1. 分享:
最后一次编辑于 15天前 0

暂无评论

推荐阅读
qi45EmQmijLD
作者其他文章 更多
最新推荐 更多