ESLintError in plugin 'gulp-eslint' - Parsing error: Unexpected token

Question

我正在做一个 ReactJs 项目，我正在用 ES7 编写代码，以便在我的 React 组件中编写更优雅的代码，特别是 static propTypes.

我将 Gulp 与 Babel、ESlint 一起使用，但我无法修复与我的静态 propTypes 相关的编译错误

这是我收到的错误消息

[11:12:34] ESLintError in plugin 'gulp-eslint' Message: Parsing error: Unexpected token = Details: fileName: [MYFOLDER]/client/components/app/article/asset/index.js lineNumber: 5 [11:12:36] [MYFOLDER]/client/components/app/article/asset/index.js 5:19 error Parsing error: Unexpected token =

它指的是行 static propTypes = {

import React from 'react';

export default class Asset extends React.Component {

  static propTypes = {
    articleImageUrl: React.PropTypes.string.isRequired,
  };

  static defaultProps = {
    articleImageUrl: 'https://placeholdit.imgix.net/~text?txtsize=60&txt=640%C3%97480&w=640&h=480'
  };


  constructor(props) {
    super(props);
  }

  render() {
    return (
      <div className="article__asset">
        <figure>
          <img src={this.props.articleImageUrl} />
        </figure>

      </div>
    );
  }
}

这是我的 babel 配置

return browserify({
            debug: true,
            entries: [`${NPM_DIR}/es5-shim/es5-shim.js`, CLIENT_DIR + '/index.js']
        })
        .transform(babelify.configure({
            sourceMapRelative: CLIENT_DIR,
            presets: ['react', 'es2015', 'stage-0'],
            plugins: ["transform-object-rest-spread", "transform-decorators-legacy", "transform-class-properties"]
        }))
        .bundle()
        .on('error', function(e){
            gutil.log(e);
        })
        .pipe(source('bundle.js'))
        .pipe(rename('bundle.min.js'))
        .pipe(gulp.dest(PUBLIC_DIR));

这是我的eslint配置

{
  "plugins": [
    "react"
  ],
  "extends":  ["eslint:recommended", "plugin:react/recommended"],
  "ecmaVersion": 7,
  "rules": {
    // rules
  },
  "parserOptions": {
    "sourceType": "module",
    "ecmaFeatures": {
      "jsx": true,
      "blockBindings": true
    }
  }
}

我做错了什么？非常感谢

Answer 1

在您的 ESLint 配置中使用 babel-eslint parser。

npm install babel-eslint --save

{
  "parser": "babel-eslint",
  "plugins": ["react"],
  ...
}

ESLintError in plugin 'gulp-eslint' - Parsing error: Unexpected token

ESLintError in plugin 'gulp-eslint' - Parsing error: Unexpected token

compiler-errors

reactjs

eslint

babeljs