美文网首页JavaScript
[JavaScript] hello flow.js

[JavaScript] hello flow.js

作者: 何幻 | 来源:发表于2017-01-13 11:25 被阅读58次

    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

    相关文章

      网友评论

        本文标题:[JavaScript] hello flow.js

        本文链接:https://www.haomeiwen.com/subject/wtfsbttx.html