Question

使用ESLint和babel时，我的main.js文件中出现以下错误

main.js

const mountNode = document.getElementById('app');
function HelloMessage(props) {
  return <div>Hello {props.name}</div>;
}
render(<HelloMessage name="test" />, mountNode);

错误是

Unexpected token (12:10) while parsing file: c:\Dev\...\src\main.js

指向

行

return <div>Hello {props.name}</div>;

我在ESLint配置中启用了ES6和JSX

"parser": "babel-eslint",
"parserOptions": {
        "ecmaVersion": 6,
        "sourceType": "module",
        "ecmaFeatures": {
            "jsx": true
        }
    },

此外，.babelrc还定义了预设

{
  "presets": ["es2015"]
}

我在这里错过了什么？

由于

Answer 1

通过将以下内容添加到我的.babelrc

，错误终于消失了

{
  "presets": ["react", "es2015"],
  "env": {
    "development": {
    }
  },
  "plugins": [
    "transform-export-extensions"
  ]
}

当然，这需要安装以下npm包

npm i --save-dev babel-preset-react babel-plugin-transform-export-extensions

由于

解析JSX文件时出现意外的令牌错误

1 个答案: