Wie löse ich eslint import/no-named-as-default

Question

Nach dem Blick auf die Dokumentation für die Import/No-Name-als-Standard-Eslint-Regel, bin ich immer noch verwirrt darüber, was genau ich falsch mache.

Ich habe die folgende Dateistruktur

. 
├── ButtonBack.css 
├── ButtonBack.jsx 
├── __tests__ 
│ └── ButtonBack.test.jsx 
└── index.js 

Der ButtonBack.jsx den folgenden Code

import React from 'react'; 
import PropTypes from 'prop-types'; 

export default class ButtonBack extends React.Component { 
    ... code removed to keep example short ... 
} 

__tests enthält __/ButtonBack.test.jsx enthält den folgenden Code

import React from 'react'; 
import { shallow } from 'enzyme'; 
import ButtonBack from '../ButtonBack'; // <== this line has an eslint warning 

... code removed to keep example short ... 

Das Problem ist, mein Linter sagt, dass import ButtonBack from '../ButtonBack verstößt gegen die folgenden Lint ru les:

• import/no-named-as-default
• import/no-named-as-default-member

ich kann nicht herausfinden, warum meine Import-Anweisung die Flusen Regel verstößt. Das Entfernen des Namens der Klasse in ButtonBack.jsx (export default class extends React.Component) behebt das Problem ebenfalls nicht.

Answer 1

Ran in das gleiche Problem und von dem, was ich sehe, Sie gehen nur diese Regel deaktivieren müssen (das ist, was ich zumindest tat)

„Leider Reagieren + Redux ist die häufigste Szenario Es gibt jedoch viele andere Fälle, in denen HOC Entwickler dazu zwingen, diese Regel zu schließen. "

https://github.com/benmosher/eslint-plugin-import/issues/544

https://github.com/reactjs/react-redux/issues/119

https://github.com/18F/calc/pull/1235

.eslintrc

"rules": { 
    "import/no-named-as-default": 0 
} 

Answer 2

in dieser Ausgabe Ran, weil ich + Redux Reagieren bin mit:

export class ButtonBack extends React.Component { // code removed } export default connect(null, null)(ButtonBack);

Also mit dem Code darüber gibt mir eine Warnung:

import ButtonBack from ./ButtonBack;

import ConnectedButtonBack from ./ButtonBack;

auf folgende behebt das Problem Ändern

class ButtonBack würde nicht exportieren wahrscheinlich auch das Problem beheben , aber ich möchte es exportieren, um beim Testen zu helfen.

Quelle: http://redux.js.org/docs/recipes/WritingTests.html#connected-components

Answer 3

Das ist ziemlich dumm für esLint aber was ich tat, um es zu lösen war Datei zu überprüfen, die exportiert hatte ich versehentlich Exportklasse dann Export Standard verbinden. Noch hatte Flusenfehler, schrieb wieder Importlinie in Eltern und eslint löschte Warnung.