React Flow检查 Props, State ， set Default Props_reactflow nodeprops

cd yourproject

npm install --save-dev flow-bin

增加"flow" 脚本到 package.json

{
  "name": "yourproject",
  "version": "1.0.0",
  "devDependencies": {
    "flow-bin": "^0.74.0"
  },
  "scripts": {
    "flow": "flow"
  }
}

npm run flow init

> yourproject@0.1.0 flow D:\NodeWorkspace\ yourproject

> flow "init"

npm run flow

> yourproject@0.1.0 flow D:\NodeWorkspace\yourproject
> flow


Launching Flow server for D:\NodeWorkspace\ch5
Spawned flow server (pid=12376)
Logs will go to C:\Users\dengyw\AppData\Local\Temp\flow\DzCzBNodeWorkspacezBch5.                              log
Monitor logs will go to C:\Users\dengyw\AppData\Local\Temp\flow\DzCzBNodeWorkspa                              cezBch5.monitor_log

Started a new flow server: -Please wait. Server is starting up: \Please wait. Se                              rver is starting up: |Please wait. Server is initializing (starting up): /Please                               wait. Server is initializing (parsed files 2000): -Please wait. Server is initi                              alizing (parsed files 4000): \Please wait. Server is initializing (parsed files                               7000): |Please wait. Server is initializing (parsed files 7000): /Please wait. S                              erver is initializing (parsed files 7000): -Please wait. Server is initializing                               (parsed files 7000): \Please wait. Server is initializing (parsed files 7000): |                              Please wait. Server is initializing (parsed files 7000): /Please wait. Server is                               initializing (parsed files 7000): -Please wait. Server is initializing (parsed                               files 7000): \Please wait. Server is initializing (parsed files 7000): |Please w                              ait. Server is initializing (parsed files 7000): /Please wait. Server is initial                              izing (parsed files 7000): -Please wait. Server is initializing (parsed files 90                              00): \Please wait. Server is initializing (parsed files 9000): |Please wait. Ser                              ver is initializing (parsed files 10000): /Please wait. Server is initializing (                              parsed files 10000): -Please wait. Server is initializing (parsed files 10000):                               \Please wait. Server is initializing (parsed files 11000): |Please wait. Server                               is initializing (parsed files 11000): /Please wait. Server is initializing (pars                              ed files 11000): -Please wait. Server is initializing (parsed files 11000): \Ple                              ase wait. Server is initializing (parsed files 13000): |Please wait. Server is i                              nitializing (parsed files 14000): /Please wait. Server is initializing (parsed f                              iles 14000): -Please wait. Server is initializing (parsed files 15000): \Please                               wait. Server is initializing (parsed files 15000): |Please wait. Server is initi                              alizing (parsed files 15000): /Please wait. Server is initializing (parsed files                               15000): -Please wait. Server is initializing (parsed files 15000): \Please wait                              . Server is initializing (parsed files 16000): |Please wait. Server is initializ                              ing (parsed files 16000): /Please wait. Server is initializing (parsed files 160                              00): -Please wait. Server is initializing (parsed files 16000): \Please wait. Se                              rver is initializing (parsed files 17000): |Please wait. Server is initializing                               (parsed files 18000): /Please wait. Server is initializing (parsed files 18047):                               -Please wait. Server is initializing (parsed files 18047): \Please wait. Server                               is initializing (parsed files 18047): |Please wait. Server is initializing (par                              sed files 18047): /Please wait. Server is initializing (parsed files 18047): -Pl                              ease wait. Server is initializing (parsed files 18047): \Please wait. Server is                               initializing (parsed files 18047): |Please wait. Server is initializing (parsed                               files 18047): /Please wait. Server is initializing (parsed files 18047): -Please                               wait. Server is initializing (parsed files 18047): \Please wait. Server is init                              ializing (parsed files 18047): |Please wait. Server is initializing (parsed file                              s 18047): /Please wait. Server is initializing (parsed files 18047): -Please wai                              t. Server is initializing (parsed files 18047): \Please wait. Server is initiali                              zing (parsed files 18047): |Please wait. Server is initializing (resolving depen                              dencies): /Please wait. Server is initializing (resolving dependencies): -Please                               wait. Server is initializing (resolving dependencies): \Please wait. Server is                               initializing (resolving dependencies): |Please wait. Server is initializing (res                              olving dependencies): /Please wait. Server is initializing (resolving dependenci                              es): -Please wait. Server is initializing (resolving dependencies): \Please wait                              . Server is initializing (calculating dependencies): |Please wait. Server is ini                              tializing (merged files 1/3 (33.3%)): /No errors!

一大串日志，不理会，有个No errors才是关键。

在文件中添加flow标识

//@flow
import React, { Component } from 'react';
import './App.css';
class App extends Component {
  render() {
    return (
      <div className="App">
        My App
      </div>
    );
  }
}
export default App;

再次执行！

npm run flow

> ch5@0.1.0 flow D:\NodeWorkspace\ch5
> flow

Error --------------------------------------------------------------------------                              ------------------------ src/App.js:5:19

Cannot use `Component` [1] with less than 1 type argument.

   src/App.js:5:19
    5| class App extends Component {
                         ^^^^^^^^^

References:
   C:\Users\dengyw\AppData\Local\Temp\flow\flowlib_2b33512f\react.js:26:31
   26| declare class React$Component<Props, State = void> {
                                     ^^^^^^^^^^^^ [1]



Found 1 error
npm ERR! code ELIFECYCLE
npm ERR! errno 2
npm ERR! ch5@0.1.0 flow: `flow`
npm ERR! Exit status 2
npm ERR!
npm ERR! Failed at the ch5@0.1.0 flow script.
npm ERR! This is probably not a problem with npm. There is likely additional log                              ging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     D:\Program Files\nodejs\node_cache\_logs\2018-06-07T14_31_45_429Z-d                              ebug.log

出错了！修改

App.js！

//@flow
import React, { Component } from 'react';
import './App.css';
class App extends Component<{}> {
  render() {
    return (
      <div className="App">
        My App
      </div>
    );
  }
}
export default App;

再次执行！

> ch5@0.1.0 flow D:\NodeWorkspace\ch5
> flow

No errors!

https://github.com/dengyaowen183/React-Flow-Test.git