最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - eslint throws parsing error unexpected token on named export - Stack Overflow

programmeradmin2浏览0评论

I have an index.js file which has the following named export in it.

export Main from './Main/Main'

However, eslint doesn't like this and throws the error

Parsing error: Unexpected token Main

I'm not sure why as the app is working properly and I believe that's valid syntax.

My .eslintrc file looks like this

{
  env: {
    es6: true,
    browser: true
  },
  parserOptions: {
    ecmaVersion: 6,
    sourceType: "module",
    ecmaFeatures: {
      jsx: true,
      experimentalObjectRestSpread: true
    }
  },
  plugins: [
    "react",
  ],
  extends: ["eslint:recommended", "plugin:react/recommended", "standard"],
  "rules": {
    "comma-dangle" : [2, "always-multiline"],
    "semi": [2, "never"],
    "no-extra-semi": 2,
    "jsx-quotes": [2, "prefer-single"],
    "react/jsx-boolean-value": [2, "always"],
    "react/jsx-closing-bracket-location": [2, {selfClosing: "after-props", nonEmpty: "after-props"}],
    "react/jsx-curly-spacing": [2, "never", {"allowMultiline": false}],
    "react/jsx-max-props-per-line": [2, {maximum: 3}],
    "react/jsx-no-literals": 2,
    "react/sort-prop-types": 2,
    "react/self-closing-comp": 2,
    "react/sort-comp": 2
  },
}

I have an index.js file which has the following named export in it.

export Main from './Main/Main'

However, eslint doesn't like this and throws the error

Parsing error: Unexpected token Main

I'm not sure why as the app is working properly and I believe that's valid syntax.

My .eslintrc file looks like this

{
  env: {
    es6: true,
    browser: true
  },
  parserOptions: {
    ecmaVersion: 6,
    sourceType: "module",
    ecmaFeatures: {
      jsx: true,
      experimentalObjectRestSpread: true
    }
  },
  plugins: [
    "react",
  ],
  extends: ["eslint:recommended", "plugin:react/recommended", "standard"],
  "rules": {
    "comma-dangle" : [2, "always-multiline"],
    "semi": [2, "never"],
    "no-extra-semi": 2,
    "jsx-quotes": [2, "prefer-single"],
    "react/jsx-boolean-value": [2, "always"],
    "react/jsx-closing-bracket-location": [2, {selfClosing: "after-props", nonEmpty: "after-props"}],
    "react/jsx-curly-spacing": [2, "never", {"allowMultiline": false}],
    "react/jsx-max-props-per-line": [2, {maximum: 3}],
    "react/jsx-no-literals": 2,
    "react/sort-prop-types": 2,
    "react/self-closing-comp": 2,
    "react/sort-comp": 2
  },
}
Share Improve this question edited Mar 25, 2016 at 22:48 Tyler McGinnis asked Mar 25, 2016 at 21:22 Tyler McGinnisTyler McGinnis 35.3k16 gold badges74 silver badges79 bronze badges 3
  • It's not valid syntax, as you can verify by looking at the spec: ecma-international.org/ecma-262/6.0/index.html#table-42 . What the correct solution is depends on what './Main/Main' exports and how it does it. – Felix Kling Commented Mar 25, 2016 at 21:36
  • 1 It's a syntax proposal, but you'll have to enable it I'd assume. – loganfsmyth Commented Mar 25, 2016 at 21:40
  • @FelixKling You're right. Got the idea from here github.com/erikras/react-redux-universal-hot-example/blob/… Thanks for the heads up! – Tyler McGinnis Commented Mar 25, 2016 at 21:50
Add a comment  | 

2 Answers 2

Reset to default 15

Figured it out. It's an experimental feature so I need to enable babel-eslint as my eslint parser.

Now my .eslintrc looks like this

{
  parser: "babel-eslint",
  env: {
    es6: true,
    browser: true
  },
  parserOptions: {
    ecmaVersion: 6,
    sourceType: "module",
    ecmaFeatures: {
      jsx: true,
      experimentalObjectRestSpread: true
    }
  },
  plugins: [
    "react",
  ],
  extends: ["eslint:recommended", "plugin:react/recommended", "standard"],
  "rules": {
    "comma-dangle" : [2, "always-multiline"],
    "semi": [2, "never"],
    "no-extra-semi": 2,
    "jsx-quotes": [2, "prefer-single"],
    "react/jsx-boolean-value": [2, "always"],
    "react/jsx-closing-bracket-location": [2, {selfClosing: "after-props", nonEmpty: "after-props"}],
    "react/jsx-curly-spacing": [2, "never", {"allowMultiline": false}],
    "react/jsx-max-props-per-line": [2, {maximum: 3}],
    "react/jsx-no-literals": 2,
    "react/sort-prop-types": 2,
    "react/self-closing-comp": 2,
    "react/sort-comp": 2
  },
}

since I got the same error for a different reason, here's where I went wrong:

If you're using babel with atom package development, babel is activated by a use babel at the beginning of every file.

use babel, much like use strict needs to be at the very beginning of the file! So much as a space in front of it will deactivate it, followed by the js engine tripping over your export statement or, similar ```unexpected token export````.

Wrong:

use babel import { bla } from 'blub'

Correct:

use babel import { bla } from 'blub'

发布评论

评论列表(0)

  1. 暂无评论