【问题标题】:Flow generates many errors for new projectFlow 为新项目生成许多错误
【发布时间】:2021-07-26 02:32:43
【问题描述】:

Flow 似乎在新项目中产生了很多错误。我做错了什么?

我做了什么:

  • 使用react-native init FlowProject 创建了一个新的 React Native 项目
  • 关注set-up for Flow with yarn and Babel
    • yarn add --dev babel-cli babel-preset-flow
    • yarn add --dev flow-bin
  • yarn run flow(.flowconfig由init生成)

这是我得到的错误:

.flowconfig:53 Unsupported option specified! (unsafe.enable_getters_and_setters)
error Command failed with exit code 8.

现在如果我删除指定的行(和版本号),我会得到一堆这两个错误:

Error: node_modules/react-native/Libraries/Inspector/Inspector.js:104
104:       clearTimeout(_hideWait);
                        ^^^^^^^^^ null. This type is incompatible with the expected param type of
733: declare function clearTimeout(timeoutId?: TimeoutID): void;
                                               ^^^^^^^^^ TimeoutID. See lib: /private/tmp/flow/flowlib_171966cc/core.js:733

Error: node_modules/react-native/Libraries/Lists/VirtualizedList.js:1094
1094:         this.props.onEndReachedThreshold * visibleLength / 2;
              ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ undefined. The operand of an arithmetic operation must be a number.

Found 19 errors
error Command failed with exit code 2.

如果我删除生成的 .flowconfig 文件(见最后),使用 yarn run flow init 重新创建它,然后再次运行 yarn run flow,我会收到以下错误(我只是显示这 5 个,其中大部分是相似):

Error: node_modules/react-native/Libraries/Animated/src/AnimatedEvent.js:101
101:     if (__DEV__) {
             ^^^^^^^ __DEV__. Could not resolve name

Error: node_modules/react-native/Libraries/Inspector/Inspector.js:104
104:       clearTimeout(_hideWait);
                        ^^^^^^^^^ null. This type is incompatible with the expected param type of
733: declare function clearTimeout(timeoutId?: TimeoutID): void;
                                               ^^^^^^^^^ TimeoutID. See lib: /private/tmp/flow/flowlib_15451c3f/core.js:733

Error: node_modules/react-native/Libraries/Interaction/InteractionManager.js:107
107:           return promise.done(...args);
                      ^^^^^^^^^^^^^^^^^^^^^ call of method `done`. Function cannot be called on
107:           return promise.done(...args);
                      ^^^^^^^^^^^^^^^^^^^^^ property `done` of unknown type

Error: node_modules/react-native/Libraries/Interaction/TaskQueue.js:165
165:       .done();
            ^^^^ property `done`. Property not found in
         v---------
152:     task.gen()
153:       .then(() => {
154:         DEBUG && infoLog(
...:
164:       })
           -^ Promise

Error: node_modules/react-native/Libraries/Lists/VirtualizedList.js:1016
1016:       distanceFromEnd < onEndReachedThreshold * visibleLength &&
                              ^^^^^^^^^^^^^^^^^^^^^ undefined. The operand of an arithmetic operation must be a number.


... 16 more errors (only 50 out of 66 errors displayed)
To see all errors, re-run Flow with --show-all-errors
error Command failed with exit code 2.

现在我知道我可以告诉 flow 忽略某些文件,但首先,我觉得很奇怪,flow 给我这些我没有生成的代码的错误。我还在 github 问题上看到我们不应该告诉 flow 忽略 node_modules。那么忽略第一个流分析给我们的每个文件的解决方案是什么?

以下是相关文件的列表:

Error node_modules/react-native/Libraries/Inspector/Inspector.js:
Error node_modules/react-native/Libraries/Interaction/InteractionManager.js
Error node_modules/react-native/Libraries/Lists/FlatList.js
Error node_modules/react-native/Libraries/Lists/ViewabilityHelper.js
Error node_modules/react-native/Libraries/Lists/VirtualizedList.js
Error node_modules/react-native/Libraries/Lists/VirtualizedSectionList.js
Error node_modules/react-native/Libraries/StyleSheet/flattenStyle.js

生成的 .flowconfig 文件

[ignore]
; We fork some components by platform
.*/*[.]android.js

; Ignore "BUCK" generated dirs
<PROJECT_ROOT>/\.buckd/

; Ignore unexpected extra "@providesModule"
.*/node_modules/.*/node_modules/fbjs/.*

; Ignore duplicate module providers
; For RN Apps installed via npm, "Libraries" folder is inside
; "node_modules/react-native" but in the source repo it is in the root
.*/Libraries/react-native/React.js

; Ignore polyfills
.*/Libraries/polyfills/.*

; Ignore metro
.*/node_modules/metro/.*

[include]

[libs]
node_modules/react-native/Libraries/react-native/react-native-interface.js
node_modules/react-native/flow/
node_modules/react-native/flow-github/

[options]
emoji=true

module.system=haste

munge_underscores=true

module.name_mapper='^[./a-zA-Z0-9$_-]+\.\(bmp\|gif\|jpg\|jpeg\|png\|psd\|svg\|webp\|m4v\|mov\|mp4\|mpeg\|mpg\|webm\|aac\|aiff\|caf\|m4a\|mp3\|wav\|html\|pdf\)$' -> 'RelativeImageStub'

module.file_ext=.js
module.file_ext=.jsx
module.file_ext=.json
module.file_ext=.native.js

suppress_type=$FlowIssue
suppress_type=$FlowFixMe
suppress_type=$FlowFixMeProps
suppress_type=$FlowFixMeState

suppress_comment=\\(.\\|\n\\)*\\$FlowFixMe\\($\\|[^(]\\|(\\(<VERSION>\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)
suppress_comment=\\(.\\|\n\\)*\\$FlowIssue\\((\\(<VERSION>\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)?:? #[0-9]+
suppress_comment=\\(.\\|\n\\)*\\$FlowFixedInNextDeploy
suppress_comment=\\(.\\|\n\\)*\\$FlowExpectedError

unsafe.enable_getters_and_setters=true

[version]
^0.61.0

【问题讨论】:

    标签: react-native flowtype


    【解决方案1】:

    你不能删除 React Native .flowconfig,因为它定义了很多项目需要的自定义配置才能干净地进行类型检查。

    让我们看看最初的错误:

    .flowconfig:53 指定了不支持的选项! (unsafe.enable_getters_and_setters) error 命令失败,退出代码为 8。

    这是由于您使用 yarn add flow-bin 安装的 Flow 版本不再支持此选项(它是 removed in 0.62)。您需要安装在 .flowconfig 的最后一行中定义的 Flow 的确切版本

    [version]
    ^0.61.0
    

    你可以这样做:

    yarn add flow-bin@0.61
    

    现在项目的类型检查应该正确了。

    请注意,将来,如果您使用 react-native upgrade 升级项目模板并接受对 .flowconfig 的更改,则可能需要手动升级您的 flow-bin 依赖项以匹配。

    【讨论】:

      【解决方案2】:

      发现这个半相关的issue 建议更新flowconfig 以使用latest version from create-react-native-app。似乎对我有用。

      【讨论】:

        【解决方案3】:

        转到根项目文件夹中的 .flowconfig 文件。

        删除此行:

        esproposal.optional_chaining=enable
        esproposal.nullish_coalescing=enable
        

        完成!

        【讨论】:

          猜你喜欢
          • 2020-06-12
          • 2013-09-12
          • 2015-05-10
          • 1970-01-01
          • 2019-11-09
          • 2011-02-11
          • 1970-01-01
          • 1970-01-01
          • 2012-02-22
          相关资源
          最近更新 更多