Create React App entfernt keine Flow-Typen im Verzeichnis node_modules

Question

Ich habe eine neue React-App mit create-react-app@1.4.3 erstellt. Und meine App hängt vom NPM-Modul ab, das mehrere Flow-JSX-Dateien enthält (retail-ui).

App.js meiner Reaktion App:

import React, { Component } from 'react'; 
import Button from "retail-ui/components/Button"; 
import './App.css'; 

export default class App extends Component { 
    render() { 
    return (
     <div> 
      <Button>First button</Button> 
      <Button>Second button</Button> 
     </div> 
    ); 
    } 
} 

Leiter Retail-ui/components/Button:

// @flow 
import events from 'add-event-listener'; 
import classNames from 'classnames'; 
import * as React from 'react'; 

import PropTypes from 'prop-types'; 

import Corners from './Corners'; 
import Icon from '../Icon'; 

import '../ensureOldIEClassName'; 
import styles from './Button.less'; 

const KEYCODE_TAB = 9; 

let isListening: boolean; 
let tabPressed: boolean; 

function listenTabPresses() { 
    if (!isListening) { 
... 

Wenn ich npm start laufen lasse, erhalte ich diese Fehlermeldung:

./src/App.js 
Failed to compile. 

./node_modules/retail-ui/components/Button/Button.js 
Module parse failed: Unexpected token (16:15) 
You may need an appropriate loader to handle this file type. 
| const KEYCODE_TAB = 9; 
| 
| let isListening: boolean; 
| let tabPressed: boolean; 
| 

Es sieht also so aus, als wären Flow-Schlüsselwörter nicht entfernt worden und die JS-Syntaxprüfung ist fehlgeschlagen. Aber wenn ich // @flow und einige Flow-Typen zu App.js hinzufügen, wird alles in Ordnung sein. Wie kann ich generierte Apps so konfigurieren, dass sie mit Flow innerhalb von Modulen funktionieren?

Answer 1

Ich schaute in Einzelhandel-ui package.json und sie scheinen keine Babel-Plugin installiert zu haben, um Flow-Typen zu entfernen. Installiere also das babel-Plugin in diesem speziellen Modul, um es zu reparieren.

npm install --save-dev babel-plugin-transform-flow-strip-types 

erstellen .babelrc Datei mit diesem Inhalt in den meisten übergeordnete Verzeichnis

{ 
    plugins: ["transform-flow-strip-types"] 
} 

sollte Bewegungsarten zur Laufzeit