Flow in JavaScript umwandeln — Numio

Wann sie hilft

• Du entfernst Flow aus einem Projekt und willst zuerst das reine JavaScript, bevor du entscheidest, ob du zu TypeScript wechselst.
• Du musst ein Flow-typisiertes Snippet an einer Stelle einfügen, die nur Standard-JavaScript akzeptiert, etwa in einer Browser-Konsole oder einem Codepen.

Anwendung

1. Füge Flow-annotierten Code (mit oder ohne // @flow-Header) in das Panel Flow ein.
2. Der Code wird an /api/flow-to-javascript gesendet, wo recast ihn mit dem Flow-Parser parst und Babel die Typen entfernt.
3. Kopiere das JavaScript aus dem Ausgabe-Panel.

// @flow
import type { Store } from './store';
import { createStore } from './store';

type State = { count: number };

export function first<T>(items: Array<T>): ?T {
  return items.length ? items[0] : null;
}

const store: Store<State> = createStore(({ count: 0 }: State));

export default store;

import { createStore } from "./store"

export function first(items) {
  return items.length ? items[0] : null
}

const store = createStore({
  count: 0,
})

export default store

Details und Einschränkungen

Die Seite sendet deine Eingabe zur Konvertierung an eine Server-Route (/api/flow-to-javascript); sie wird nicht nur im Browser verarbeitet. Next.js-API-Routen akzeptieren standardmäßig Request-Bodys bis 1 MB.

Nur Typen werden entfernt. Moderne Syntax wie JSX, ?? oder Klassenfelder wird nicht transpiliert.

Das Ergebnis wird mit Prettier neu formatiert (doppelte Anführungszeichen, keine Semikolons); der ursprüngliche Stil bleibt also nicht erhalten, und ein Type-Cast wie ({ count: 0 }: State) verliert seine zusätzlichen Klammern.

Ein // @flow-Kommentar, der an einer entfernten Typdeklaration hängt, wird mit ihr entfernt.

FAQ

Ähnliche Tools

Spezifikationen und Referenzen

• @babel/plugin-transform-flow-strip-types