将流类型检查添加到Webpack,Babel& Eslint

时间:2018-05-23 07:47:57

标签: javascript reactjs webpack flowtype

我有一个Webpack 4配置文件,它使用Babel(加上第3阶段预设和一些优化插件)将ES6 React代码编译为ES5。它用Eslint来代替代码。

import path from 'path';


export default {
  mode: 'development',
  entry: './app/app.jsx',
  devtool: 'inline-source-map',
  output: {
    path: path.resolve(__dirname, 'dist'),
    filename: 'app.js',
    publicPath: '/dist/js',
  },
  module: {
    rules: [
      {
        enforce: 'pre',
        test: /\.(js|jsx)$/,
        exclude: /node_modules/,
        loader: 'eslint-loader',
      },
      {
        test: /\.(js|jsx)$/,
        exclude: /node_modules/,
        loader: 'babel-loader',
        options: {
          presets: ['es2015', 'stage-3', 'react'],
          plugins: [
            'babel-plugin-styled-components',
            'transform-react-remove-prop-types',
            'transform-react-inline-elements',
          ],
        },
      },
    ],
  },
};

现在我想将Flow类型检查添加到我的项目中,但是我找不到任何关于如何配置这样的配置的完整示例。

我尝试将eslint-plugin-flow添加到Eslint配置中。我尝试将babel-preset-flow添加到Babel预设中。我总是得到关于需要一个合适的加载器来处理文件的错误,或者它抱怨我的Flow代码无效。

注意我的配置在添加Flow之前有效。任何人都可以展示如何添加Flow吗?

0 个答案:

没有答案