だから次eslintファイルを検討

Question

を反応させて使用する場合にeslintを無効にする必要はありません。私はeslint:recomended拡張子とreactプラグインを使用します。

import React from 'react'; // eslint-disable-line 
import ReactDOM, { render } from 'react-dom'; // eslint-disable-line 
import StartUp from './components/startup.js'; // eslint-disable-line 

render(
    <StartUp />, 
    document.getElementById('app') 
); 

お知らせ無効：

は今、次のファイルを考えてみましょう。私がこのシステム全体をうまく動作させてもうまくいけば、何もインポートに失敗し、すべてが見つかり、アプリケーション全体がうまくロードされます。

しかし、私はそれらの無効を削除する場合、私は、次を得る：

1:8 error 'React' is defined but never used  no-unused-vars 
    2:8 error 'ReactDOM' is defined but never used no-unused-vars 
    3:8 error 'StartUp' is defined but never used no-unused-vars 

これが起こってはいけません。 これらは「使用されていない」ことを理解するために設定する必要があるのは何ですか？

Answer 1

Webpackを使用しているので、完全にESLintを回避して、ProvidePluginを使用してReactとReactDOMをどこでも利用できることを確認できます。あなたはWebPACKの設定ファイルにちょうどこのようにそれを使用することができます：

const webpack = require('webpack'); 

module.exports = { 
    // The rest of your config file... 
    ..., 
    plugins: [ 
    new webpack.ProvidePlugin({ 
     React: 'react', 
     ReactDOM: 'react-dom' 
    }) 
    ] 
}; 

最後の一つは、その後、プラグインが含まれており、あなたが使用可能にしてくださいあなたはESLint React plugin

npm install eslint-plugin-react --save-dev 

をインストールしていることを確認してくださいjsx-uses-varsルール。

{ 
    ... 
    "plugins": ["react"], 
    "parserOptions": { 
    "ecmaFeatures": { 
     "jsx": true 
    } 
    }, 
    "rules": { 
    "react/jsx-uses-vars": ["error"] 
    } 
} 

は、次に、あなたのコードは次のように書くことができます：あなたはそれがあなたのためにそれの世話をします有効にすることができeslint-プラグインに反応して出荷するルールは

import { render } from 'react-dom'; 
import StartUp from './components/startup.js'; 

render(
    <StartUp />, 
    document.getElementById('app') 
); 

Answer 2

あなたは.eslintrcファイル内にReactとこれらの他のものをグローバルとして追加できると思います。

Answer 3

があります。あなたのビルドシステムで使用している何 https://github.com/yannickcr/eslint-plugin-react#recommended