flow中文文档:https://zhenyong.github.io/flowtype/docs/objects.html#_

1、安装flow

  npm install --save-dev flow-bin

2、安装完成后在package.json中加入下面的脚本

  1. "scripts": {"flow":"flow check"}

3、安装babel编译器,将flow的类型检查代码从代码中剥离,转变成正常的js代码

  npm install --save-dev babel-cli babel-preset-flow

4、在babel配置文件.babelrc中加入

  1. {"presets": ["flow"]}

5、创建flow配置文件

  touch .flowconfig

  注意:在vue单文件组件使用flow需要额外配置:

     1、在.flowconfig文件的[options]中配置.vue文件扩展名

     2、在.vue文件中需注释掉template script styled标签

  1. [ignore]
  2. .*/node_modules/.*
  3. .*/test/.*
  4. .*/build/.*
  5. .*/config/.*
  6. [include]
  7.  
  8. [libs]
  9.  
  10. [options]
  11. module.file_ext=.vue
  12. module.file_ext=.js

6、新建一个文件index.vue

  //@flow或者 /*@flow*/告诉flow检查这个文件  

  1. /* @flow
  2. <template>
  3. <div>
  4. </div>
  5. </template>
  6. */
  7. // <script>
  8. let a:string = 2;
  9. console.log(a);
  10. export default {
  11. data(){
  12. return {
  13.  
  14. }
  15. }
  16. }
  17. // </script>
  18. /*
  19. <style scoped>
  20. </style>
  21. */

7、输入npm run flow 执行类型检查

  

  1.  

在vue中配置flow类型检查的更多相关文章

  1. flow类型检查

    https://blog.csdn.net/tangxiujiang/article/details/80778627 Flow的简单介绍 2018年06月22日 21:54:25 tangxiuji ...

  2. vue项目配置使用flow类型检查

    你是否经常在debug那些简单可避免的bug?可能你给函数传参的时候搞错了参数的顺序,或者本来应该传个Number类型的参数,你传了一个String类型?JavaScript的弱类型是这一类bug的罪 ...

  3. 在VUE应用中配置ESLint(代码检查)

    eslint配置方式 注释配置:使用js注释来直接嵌入ESLint配置信息到一个文件里 配置文件:使用一个js文件,JSON或者YAML文件来给整个目录和它的子目录指定配置信息.这些配置可以写在一个文 ...

  4. vue中配置axios.js文件,发送请求

    为了统一管理请求,每个项目都会去配置axios:而不是在vue中直接使用,那样不好维护等等 下面是我配置的最基础的axios文件 第一步:首先新建一个axios文件,我是放在router文件下的 im ...

  5. vue中配置sass(包含vue-cli 3)

    目录 vue vue cli 3 老版本的脚手架搭建的项目 版本 安装 不用修改任何配置 vue文件中使用 vue 更新时间: 2018-09-21 vue cli 3 选择 Manually sel ...

  6. 在网站中配置MIME类型

    经常会遇到这样的情况,某种类型的文件不能够正常下载,*.7z,自定义的文件类型等,需要在配置文件里配置后才能正常下载. 打开Web.Config文件: <system.webServer> ...

  7. TypeScript 在vue中定义全局类型

    全局类型定义 路径 src/types/store.d.ts /** * 定义全局的State在 store.d.ts文件中 */ // 单独的state,导出为单独的module使用 export ...

  8. vue中配置可修改的服务器接口api

    https://www.jianshu.com/p/377bfd2d9034?utm_campaign 太坑了,找了全网,几乎都不能用,也不知道哪写错了,这个是可以用的.

  9. Python中的对象行为与特殊方法(二)类型检查与抽象基类

    类型检查 创建类的实例时,该实例的类型为类本身: class Foo(object): pass f = Foo() 要测试实例是否属于某个类,可以使用type()内置函数: >>> ...

随机推荐

  1. java集成memcached、redis防止缓存穿透

    下载相关jar,安装Memcached,安装教程:http://www.runoob.com/memcached/memcached-install.html spring配置memcached &l ...

  2. Eigen3安装及注意

    执行命令: sudo apt-get install libeigen3-dev 安装后执行以下命令 运行命令: sudo cp -r /usr/include/eigen3/Eigen /usr/i ...

  3. libgdx学习记录3——动画Animation

    libgdx动画采用Animation实现,即通过帧动画实现. 代码如下: package com.fxb.newtest; import com.badlogic.gdx.ApplicationAd ...

  4. Java 实现文件压缩工具类

    package com.wdxc.util; import java.io.BufferedInputStream; import java.io.File; import java.io.FileI ...

  5. css3动画:transition和animation

    概述 之前写过css3 动画与display:none冲突的解决方案,但是最近却发现,使用animation效果比transition好得多,而且不和display:none冲突.下面我把相关新的记录 ...

  6. LabVIEW(七):多态VI

    1.多态VI概念:可以处理多种不同数据类型的VI被称为“多态VI”.多态VI根据输入或输出的 数据类型,再选择调用一个针对这种数据类型实现功能的VI,这些针对某种数据类型实现功能的VI称作“实例VI” ...

  7. Spring autowire自动装配 ByType和ByName

    不使用自动装配前使用的是类的引用: <?xml version="1.0" encoding="UTF-8"?> <beans xmlns=& ...

  8. CentOS 7.x 安装 Docker-Compose

    一.安装步骤 添加企业版附加包. yum -y install epel-release 安装 PIP. yum -y install python-pip 更新 PIP. pip install - ...

  9. mysql 开发进阶篇系列 45 物理备份与恢复(xtrabackup 安装,用户权限,配置)

    一. 安装说明 安装XtraBackup 2.4 版本有三种方式: (1) 存储库安装Percona XtraBackup(推荐) (2 )下载的rpm或apt包安装Percona XtraBacku ...

  10. Spring的后处理器-BeanPostProcessor跟BeanFactoryPostProcessors

    最近在重读spring源码(为什么要重读?因为不得不承认,去年跟着<深入解析sping源码>一书过了一遍spring的源码,除了满脑袋都是各种BeanFactory跟BeanDefinit ...