JSX niedozwolone w plikach z rozszerzeniem „js” z eslint-config-Airbnb

Question

mam zainstalowane eslint-config-airbnb, który ma wstępnie configure ESLINT dla React:

Nasz domyślny eksport zawiera wszystkich naszych zasad ESLint , w tym ECMAScript 6+ i React. Wymaga eslint, eslint-plugin-import, eslint-plugin-react i eslint-plugin-jsx-a11y.

My .eslintrc rozszerzenie jego konfiguracja:

{ "extends": "eslint-config-airbnb", 
    "env": { 
    "browser": true, 
    "node": true, 
    "mocha": true 
    }, 
    "rules": { 
    "new-cap": [2, { "capIsNewExceptions": ["List", "Map", "Set"] }], 
    "react/no-multi-comp": 0, 
    "import/default": 0, 
    "import/no-duplicates": 0, 
    "import/named": 0, 
    "import/namespace": 0, 
    "import/no-unresolved": 0, 
    "import/no-named-as-default": 2, 
    "comma-dangle": 0, // not sure why airbnb turned this on. gross! 
    "indent": [2, 2, {"SwitchCase": 1}], 
    "no-console": 0, 
    "no-alert": 0, 
    "linebreak-style": 0 
    }, 
    "plugins": [ 
    "react", "import" 
    ], 
    "settings": { 
    "import/parser": "babel-eslint", 
    "import/resolve": { 
     "moduleDirectory": ["node_modules", "src"] 
    } 
    }, 
    "globals": { 
    "__DEVELOPMENT__": true, 
    "__CLIENT__": true, 
    "__SERVER__": true, 
    "__DISABLE_SSR__": true, 
    "__DEVTOOLS__": true, 
    "socket": true, 
    "webpackIsomorphicTools": true 
    } 
} 

Niestety Dostaję następujący błąd podczas strzępienia plik js z React kod JSX wewnątrz niego:

error JSX not allowed in files with extension '.js'    react/jsx-filename-extension 

nie było eslint-config-airbnb skonfigurowane reagować na wsparcie JSX już, jak stwierdzono?

Co należy zrobić, aby usunąć ten błąd?

Answer 1

Zmień rozszerzenia plików na .jsx zgodnie z wymienioną lub wyłączoną zasadą jsx-filename-extension. Możesz dodać następujące elementy do swojej konfiguracji, aby zezwolić na rozszerzenia .js dla JSX.

"rules": { 
    "react/jsx-filename-extension": [1, { "extensions": [".js", ".jsx"] }], 
} 

Answer 2

wyłożyć na Martin's odpowiedź wydaje się, że to nie jest możliwe, obecnie w użyciu JSX w React Native. A PR został utworzony, ale został przywrócony z powodu obaw związanych z fragmentacją i nieznanymi konsekwencjami posiadania rzeczy takich jak index.ios.jsx. Nie jestem pewien, w jaki sposób działa AirBnb lub czy tak, ale użyłem w zasadzie tego samego bloku rules jak Martin.