2016-11-23 3 views
2

I eslint + babel-eslint + eslint-plugin-react + eslint-plugin-flowtypeeslint-plugin-flowtype nicht überprüft

zu konfigurieren versuche ich die folgende devDependencies haben in package.json:

"babel-eslint": "^7.1.1", 
"eslint": "^3.10.2", 
"eslint-config-airbnb": "^13.0.0", 
"eslint-plugin-flowtype": "^2.25.0", 
"eslint-plugin-import": "^2.2.0", 
"eslint-plugin-jsx-a11y": "^2.2.3", 
"eslint-plugin-react": "^6.7.1" 

Und die folgende .eslinrc:

{ 
    "parser": "babel-eslint", 
    "plugins": [ 
    "flowtype" 
    ], 
    "extends": [ 
    "airbnb", 
    "plugin:flowtype/recommended" 
    ], 
    "rules": { 
    "max-len": [1, 80, 2, {"ignoreComments": true}], 
    "prop-types": [0], 
    "react/jsx-filename-extension": [1, { "extensions": [".js", ".jsx"] }], 
    "react/prefer-stateless-function": [ 
     0, 
     { 
     "ignorePureComponents": true 
     } 
    ], 
    "no-console": 0 
    }, 
    "settings": { 
    "flowtype": { 
     "onlyFilesWithFlowAnnotation": true 
    } 
    } 
} 

Ich schrieb einfaches Codebeispiel in App.js:

function foo() { 
    const a: string = 1; 
    return a; 
} 

async function bar() { 
    const b = await foo(); 
    return b; 
} 

Wenn ich eslint src/App.js starte, dann zeigt eslint keine Nachrichten an. Wenn ich hinzufügen "flowtype/require-return-type": 2 in .eslintrc dann eslint zeigt:

error Missing return type annotation flowtype/require-return-type 
error Missing return type annotation flowtype/require-return-type 
✖ 2 problems (2 errors, 0 warnings) 

Aber ich verstehe nicht, warum const a: string = 1; gültig ist. Wie kann der Prüftyp const a: string = 1; aktiviert werden?

Antwort

5

eslint-plugin-flowtype ist nicht Flow. Es ist eine Erweiterung von ESLint, die eine Sammlung von Lint-Regeln enthält, die nur für die zusätzliche Syntax von Flow relevant sind.

Zum Beispiel gibt es eine rule, die Sie, ob in Objekttypen Fluss Komma oder Semikolon verwenden können erzwingen (zB type Foo = {bar: string, baz: number} vs type Foo = {bar: string; baz: number})

jedoch tatsächlich bekommen Typprüfung Sie Flow installieren müssen, und folgen Sie den Anweisungen dort einzurichten. Kurz gesagt, Sie müssen sicherstellen, dass Sie eine .flowconfig Datei in Ihrem Projekt root haben, stellen Sie sicher, dass Sie die // @flow Header auf alle Ihre Dateien haben, und dann flow status von der Kommandozeile aus (oder Nuclide oder einen anderen Editor mit Flow-Unterstützung) .

+0

Vielen Dank für die Antwort! Weißt du, ist es möglich, 'flowtype + eslint' zu verwenden? Ich meine, ist es möglich, 'eslint' Fehler von' flowtype' zu ​​zeigen, wenn ich 'eslint App.js' starte? –

+0

Es ist möglich, aber niemand, dem ich bewusst bin, hat etwas geschrieben, um den Flow in ESLint anzuzeigen. Persönlich denke ich nicht, dass es eine gute Idee wäre. Es ist besser, Flow wie vorgesehen zu verwenden und ESLint wie vorgesehen als separate Tools zu verwenden. –

1

eslint-plugin-flowtypedoesn't appear to have a rule to check that.

Der Zweck des Linter-Plugins ist es, stilistische Dinge oder Konvention Dinge zu erzwingen (wie immer kommentieren Funktionsrückgabe Typen), nicht zu prüfen, Typen selbst.

Sie möchten Flow selbst ausführen, um zu überprüfen, ob die Typen tatsächlich korrekt sind.

1

Wenn Sie möchten, dass ESLint Flow verwendet, um Ihren Code zu validieren, ist das richtige zu verwendende Plugin .

https://www.npmjs.com/package/eslint-plugin-flowtype-errors

Wie andere schrieb, überprüft eslint-plugin-flowtype nur, dass Code mit FlowType Aussagen syntaktisch korrekt sind. Es führt keine Validierung des Flow-Typs durch.

Verwandte Themen