1. 搭建webpack+babel项目
(1)全局安装webpack和babel
npm install -g webpack babel-cli
(2)在项目根目录,安装项目依赖
npm install babel-preset-es2015 babel-loader
(3)在项目根目录,创建文件:webpack.config.js
module.exports = {
entry: {
index: './index.js',
example: './example/index.js'
},
output: {
path: './dist/',
filename: '[name].js',
libraryTarget: 'umd'
},
module: {
loaders: [{
test: /.js$/,
loader: 'babel-loader'
}]
}
};
(4)在项目根目录,创建文件:.babelrc
{
"presets": [
"es2015"
],
"plugins": []
}
2. 与babel的flow插件相关
(1)全局安装flow命令行工具
npm install -g flow-bin
(2)在项目根目录,创建.flowconfig
文件
touch .flowconfig
(3)安装babel插件
npm install --save-dev babel-plugin-transform-flow-strip-types
(4)在.babelrc
文件中添加插件
{
"plugins": [
"transform-flow-strip-types"
]
}
与IDE相关
(1)安装VS Code
https://code.visualstudio.com/
(2)安装扩展(⇧⌘X):Flow Language Support
Github:https://github.com/flowtype/flow-for-vscode
(3)修改VS Code对JavaScript的默认配置
Code -> 首选项 -> 用户设置(⌘,)
搜索:javascript.validate.enable
修改为:"javascript.validate.enable": false
参考
The Basics of Visual Studio Code: Configuring the Editor
Getting started with Flow
网友评论