Nextjs Reactjs:意外的令牌'<'使用eslint时出错

时间:2017-06-15 23:38:27

标签: reactjs react-jsx babel eslint next.js

我正在处理Nextjs-React应用程序,并且在运行npm run lint错误时出现此错误:../../Projects/app/pages/index.js ESlint Parsing error: Unexpected token <对于.js个文件jsx在他们中。所以在我看来eslint不喜欢在扩展名为'.js'

的文件中使用JSX

这些是我的babel eslint套餐:

 "babel-cli": "^6.18.0",
"babel-core": "^6.18.2",
"babel-eslint": "^7.1.0",
"babel-loader": "^6.2.7",
"babel-plugin-rewire": "^1.0.0",
"babel-plugin-transform-runtime": "^6.15.0",
"babel-preset-latest": "^6.16.0",
"babel-preset-react": "^6.16.0",
"babel-preset-react-optimize": "^1.0.1",
"babel-types": "^6.18.0",
"eslint": "^3.9.1",
"eslint-config-airbnb": "^13.0.0",
"eslint-loader": "^1.6.1",
"eslint-plugin-import": "^2.2.0",
"eslint-plugin-jsx-a11y": "^2.2.3",
"eslint-plugin-react": "^6.6.0",
"webpack": "^1.13.3",
"webpack-hot-middleware": "^2.13.2",
"webpack-middleware": "^1.5.1"

这些是我的规则:

"babel": {
"presets": [
  "react",
  "latest"
],
"plugins": [
  "syntax-trailing-function-commas",
  "transform-async-to-generator",
  "transform-es2015-destructuring",
  "transform-es2015-parameters",
  "transform-es2015-duplicate-keys",
  "transform-es2015-modules-commonjs",
  "transform-exponentiation-operator",
  "transform-runtime"
],
"env": {
  "test": {
    "plugins": [
      "rewire"
    ]
  }
}},

Eslint configs:

"eslintConfig": {
"parser": "babel-eslint",
"extends": "airbnb",
"env": {
  "browser": true
},
"rules": {
  "jsx-quotes": [
    2,
    "prefer-double"
  ],
  "no-confusing-arrow": 0,
  "react/jsx-filename-extension": [
    1,
    {
      "extensions": [".js", ".jsx"]
    }
  ],
  "react/jsx-quotes": 0,
  "react/jsx-boolean-value": 0,
  "jsx-a11y/anchor-has-content": "off",
  "import/extensions": "off",
  "comma-dangle": [
    2,
    {
      "arrays": "always-multiline",
      "objects": "always-multiline",
      "imports": "always-multiline",
      "exports": "always-multiline",
      "functions": "ignore"
    }
  ],
  "no-plusplus": [
    2,
    {
      "allowForLoopAfterthoughts": true
    }
  ]
}},

不知道如何解决这个问题,我已经在线查看了其他答案但没有帮助。设置特定规则 "rules": { "react/jsx-filename-extension": [1, { "extensions": [".js", ".jsx"] }] } 也没有帮助。代码构建得很好,只是linter失败

1 个答案:

答案 0 :(得分:0)

已解决此问题answer。问题是我没有转发webpack配置代码,因为.babelrc会覆盖我在webpack级别的配置