安装ESlint后React中的意外令牌

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

这里是我的.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 />'，它就可以工作。为什么？我dont't想使用组件的调用报价。这个问题随处可见，使用JSX语法。这里也是：

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

）;

也许我必须添加一些规则.eslintrc。你能帮助我吗？

谢谢。

来源

2017-08-31 Štefan Ondáš

您可能需要添加ESLint插件，例如，这一个：https://www.npmjs.com/package/eslint-plugin-react –

您好马特，我已经安装了这个插件，但它不工作。 –

当你写“”它呈现的组成部分？ – gabrielwr

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

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

来源

2017-09-05 10:35:54

安装ESlint后React中的意外令牌

回答

相关问题