Question

在我开始使用 ESlint 后， React.js 中出现意外令牌问题。

这是我的.eslintrc文件：

{
 parser: "babel-eslint",
  "ecmaFeatures": {
  "jsx": true,
  "modules": true
 },
"rules": {
 "max-len": [1, 120, 2, {ignoreComments: true}],
 "linebreak-style": 0,
 "semi": [2, "never"],
 "jsx-quotes": [2, "prefer-single"],
 "react/jsx-curly-spacing": [2, "always"],
 "react/prefer-stateless-function": [0]
 },
"globals": {
 "document": true,
 "localStorage": true
 },
"extends": ["airbnb-base"]
}

在index.js中我有这个定义：

ReactDOM.render(<App />, document.getElementById('main'));

Syntax error (unexpected token)位于<App />。如果我添加这样的'<App />'引号，它就可以了。为什么？我不想在组件调用中使用引号。 JSX语法无处不在。在这里：

const App = () => (
<Router>
    <div>
        <Route exact path="/" component={Landing} />
        <Route path="/home" component={Home} />
        <Route path="/about" component={About} />
    </div>
</Router>

）;

我可能必须在.eslintrc添加一些规则。你能帮我解决这个问题吗？

感谢。

Answer 1

感谢您的回复。我已经安装了你编写的所有插件。最后，问题出在我的webpack配置文件中。我忘了设置查询 - 装载机中的预设。现在它正在运作。

{
    test: /\.jsx?$/,
    exclude: /node_modules/,
    loaders: ['babel-loader', 'eslint-loader'],
    query: {
        presets: ['es2015', 'react']
    }
}

安装ESlint后React中出现意外的令牌

1 个答案: