Javascript静态类型检测器Flow安装教程

516 2 年前
可以根据你的工作环境选择安装Flow的编译器,首先,你需要一个编译器来剔除Flow的类型注解。你可以选择Babel或flow-remove-types.

为一个项目安装和设置Flow

依赖于你使用的工具和环境,这里有几种方式安装Flow

安装编译器

首先,你需要一个编译器来剔除Flow的类型注解。你可以选择Babelflow-remove-types.

Babel

Babel是一个支持FlowJavascript编译器。Babel我们通俗的理解就是把现在浏览器不支持的新特性(比如:ES6)转换为可以支持的ES5语法,从而使我们能在项目中体测新标准带来的福利。Babel使用我们Flow代码,并剔除所有的类型注解。

首先得安装 babel-clibabel-preset-flow

npm 环境

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

Yarn 环境

yarn add --dev babel-cli babel-preset-flow

然后,你需要在项目根目录里新建一个 .babelrc文件,并在 presets属性里设置 flow

{
  "presets": ["flow"]
}

如果你的源代码在 src 目录里,你可以将这些代码编译到另一个目录中

npm 环境

./node_modules/.bin/babel src/ -d lib/

Yarn 环境

yarn run babel src/ -- -d lib/

当然,在 package.json配置运行

{
  "name": "my-project",
  "main": "lib/index.js",
  "scripts": {
    "build": "babel src/ -d lib/"
  }
}

这样运行 npm run buildyarn run build 即可 。

flow-remove-types

flow-remove-types是一个简单去掉类型注释的命令行工具,他是一个不需要 Babel 支持的轻量级代替 Babel的工具。

首行安装 flow-remove-types

npm 环境

npm install --save-dev flow-remove-types

Yarn 环境

yarn add --dev flow-remove-types

如果你的源代码在 src 目录里,你可以将这些代码编译到另一个目录中

npm 环境

./node_modules/.bin/flow-remove-types src/ -d lib/

Yarn 环境

yarn run flow-remove-types src/ -- -d lib/

package.json配置运行

{
  "name": "my-project",
  "main": "lib/index.js",
  "scripts": {
    "build": "flow-remove-types src/ -d lib/"
  }
}

使用npm run buildyarn run build 运行。

安装 Flow

把一个明确版本的Flow 单独安装到项目比全局安装更好。如果你熟悉 npm 或者 yarn安装过程更加容易。

npm 环境

npm包安装到devDependency

npm install --save-dev flow-bin

package.jsonscripts 里添加 "flow"

{
  "name": "my-flow-project",
  "version": "1.0.0",
  "devDependencies": {
    "flow-bin": "^0.86.0"
  },
  "scripts": {
    "flow": "flow"
  }
}

首先运行

npm run flow init

在第一次运行了 init 后,运行

npm run flow

Yarn 环境

npm包安装到devDependency

yarn add --dev flow-bin

首先运行

yarn run flow init

然后运行Flow

yarn run flow

更多请访问 Flow 安装

分类栏目
© 2018邮箱:11407215#qq.comGitHub沪ICP备12039518号-6