BabelJS教程

Babel Flow

Flow 是 JavaScript 的静态类型检查器。要使用 flow 和 babel,我们将首先创建一个项目设置。我们在项目设置中使用了 babel 6、如果您想切换到 babel 7,请使用 @babel/babel-package-name 安装所需的 babel 包。

命令

npm init
安装 flow 和 babel 所需的包-
npm install--save-dev babel-core babel-cli babel-preset-flow flow-bin babel-plugin-transform-flow-strip-types
这里是安装后最终的package.json。还添加了 babel 和 flow 命令来执行命令行中的代码。
Execute_Flow_Command.jpg
在项目设置中创建 .babelrc 并添加如下所示的预设
添加预设
创建一个 main.js 文件并使用 flow 编写您的 JavaScript 代码-
main.js
/* @flow */
function concat(a: string, b: string) {
   return a + b;
}
let a = concat("A", "B");
console.log(a);
使用babel命令使用presets编译代码:flow to normal javascript
npx babel main.js--out-file main_flow.js
main_flow.js
function concat(a, b) {
   return a + b;
}
let a = concat("A", "B");
console.log(a);
我们还可以使用名为 babel-plugin-transform-flow-strip-types 的插件代替预设,如下所示-
.babelrc中,添加插件如下-
Babelrc Plug
main.js
/* @flow */
function concat(a: string, b: string) {
   return a + b;
}
let a = concat("A", "B");
console.log(a);

命令

npx babel main.js--out-file main_flow.js
main_flow.js
function concat(a, b) {
   return a + b;
}
let a = concat("A", "B");
console.log(a);
昵称: 邮箱:
Copyright © 2022 立地货 All Rights Reserved.
备案号:京ICP备14037608号-4