React Native: 'React'引用了一个umd全局对象,但当前文件是一个模块,请考虑添加一个import语句。
React Native中出现'React' refers to a umd global but the current file is a module consider adding an import instead的问题是由于没有正确导入React模块导致的。解决方法是添加正确的React导入语句。
在React Native中,不需要使用*导入所有内容,只需要导入React模块即可使JSX代码被正确解析。可以通过以下方式进行导入:
import React from 'react';
需要注意的是,虽然这种解决方法有效,但并不被推荐使用。React开发人员Dan Abramov在推特上明确表示不推荐这种写法,具体内容可以参考以下链接:twitter.com/dan_abramov/status/…
在React Native中出现这个问题的原因是当前文件是一个模块,但是'React'指的是一个umd全局变量。解决方法是在代码的导入语句中添加import * as React from 'react';
。
参考链接:
React Native中出现"React Native: 'React' refers to a umd global but the current file is a module consider adding an import instead"的问题是因为在React 17中引入了新的JSX转换方式,不再需要在每个使用JSX的文件中导入React。解决方法是通过编辑tsconfig中的jsx编译选项来使用"react-jsx"。具体步骤如下:
1. 打开tsconfig文件。
2. 在compilerOptions中找到jsx选项。
3. 将jsx选项的值改为"react-jsx"。
4. 保存文件。
以下是示例的tsconfig文件内容:
{
"compilerOptions": {
"jsx": "react-jsx"
}
}
以前的默认转换方式是将JSX编译为对React.createElement的调用,因此需要在作用域中引入React才能正常工作。然而,新的"react-jsx"转换方式使用_jsx函数,并自动插入import语句。在这个改变之后,可以安全地删除未使用的React导入。
更多信息可以参考React官方博客中的文章:https://legacy.reactjs.org/blog/2020/09/22/introducing-the-new-jsx-transform.html。
以上方法经过验证可行。