React-Native启动时出现“Invalid regular expression invalid”错误

Question

React-Native启动时出现“Invalid regular expression invalid”错误

reactjsreact-nativereact-native-climetro-bundler

26

我按照以下链接开始学习react-native:

我尝试创建没有Expo的原生应用程序，所以根据文件，我执行了以下命令：

npm install -g react-native-cli
react-native init AwesomeProject

执行完Android命令后

react-native run-android

模拟器显示以下错误

因此我使用start命令运行metro服务器

react-native start

这个命令在控制台中给了我另一个错误。

- user4241989

我不知道它是否有效，但尝试关闭Hermes并尝试一次。https://facebook.github.io/react-native/docs/hermes/ - Thakur Karthik

10个回答

17

这是Nodejs的兼容性问题。我卸载了Node（12.11），安装了Node（10）稳定版本，它完美地工作了。

- user4241989

2

解决方案是更改模块metro-config文件中的blacklist.js文件，如上所述。但每次运行npm/yarn install时，您都必须再次更改它。

因此，我想到了一个解决方案，可以节省您去文件并每次更改它的时间：

我使用了一个使用JavaScript编辑文件的库：

安装Replace-in-file模块：

npm install --save replace-in-file

在与node_module文件夹同级别创建一个文件，命名为：metro-fix.js 例如。
将以下脚本复制粘贴到该文件中：

//Load the library
const replace = require('replace-in-file');
// path for metro config file
const path = 'node_modules/metro-config/src/defaults/blacklist.js';
// creating options for editing the file
const options = [
  {
    files: path,
    from: 'modules[/',
    to: 'modules[\\/',
  },
  {
    files: path,
    from: 'react[/',
    to: 'react[\\/',
  },
  {
    files: path,
    from: 'dist[/',
    to: 'dist[\\/',
  },
];

try {
  let results;
  // looping on each option
  options.forEach(e => {
    results = replace.sync(e);
    console.log('Replacing "'+e.from+'" by "'+e.to+'"  results:', results[0].hasChanged);
  });

} catch (error) {
  console.error('Error occurred:', error);
}

现在每次运行npm install时，只需运行以下命令：

node metro-fix.js

请参阅 Replace-in-file 文档。

- Moussaabmma

1

是的，只需切换到 Node 版本 10，它就可以正常工作。

nvm install <version>
nvm use <version>

它有效...... :)

- Shekhar Kumar

嗨，Shekhar，欢迎来到Stack Overflow并感谢您的贡献。由于您是SO的新手，以下是一些关于如何撰写更好答案的提示：（1）您假设用户没有使用node v10。您可以通过评论请求澄清。（2）您还假设该人正在使用nvm。提问者可能不知道它是什么，这可能会增加他们的困惑。 - Sterex

1

当你使用choco命令（choco install -y nodejs.install python2 jdk8）安装NodeJS时，它将安装最新版本的Node，目前版本为12.12.0。你需要将其降级到10.16.3，然后运行react-native run-android命令，就可以正常工作了。

- Yatendra Dubey

1

有一个类似的问题在这里被问到，也许这个解决方案适用于你，因为我尝试过并且有效。

- Charles

0

这是因为Node版本过高。

其中一个解决方案是，您可以轻松将Node版本从12.x降级到10.x或卸载12.x并安装10.x。
另一方面，如果您想要在其他项目中使用12.x，下面的解决方案会更容易。您可以使用nvm来控制多个Node版本。

首先从这里https://github.com/coreybutler/nvm-windows/releases安装nvm。

安装完成后，请记得将nvm路径添加到系统变量中。

然后执行nvm install 10.18.1 64

然后执行nvm install 12.14.1 64

要列出所有已安装的版本，请使用nvm list

每当您想要从一个版本切换到另一个版本时，请使用以下命令

nvm use 10.18.1  OR nvm use 12.14.1

- Deepak N

0

关闭命令提示符和Metro Bundler，然后再重试。

- Majid Aziz

0

我通过以下步骤解决了这个问题：

卸载 Node.js v12 并安装 Node.js v8.9.4
重新安装 React Native 命令行工具
重新创建项目 react-native init myApp --version 0.60.0
react-native start

希望能对你有所帮助。

- Alhaddi Mulyadi

0

是的，我也遇到了这个问题。实际上，Node.js 推荐大多数用户使用的版本是 10.16.3 LTS。使用以下 choco 命令将安装最新版本的 12.11.0。 choco install -y nodejs.install python2 jdk8

我将 Node 版本从 12.11.0 降级到 10.16.3 LTS，这对我有用。

- senthilkumar sugumar

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Javier C. · Accepted Answer

Metro在使用某些NPM和Node版本时存在问题。

你有2个选择：

选择1：卸载node和npm，并使用另一个（兼容的）版本重新安装：https://nodejs.org/en/download

选择2：进入 npde_modules 文件夹中的一个文件：\node_modules\metro-config\src\defaults\blacklist.js 并更改此代码：

var sharedBlacklist = [
  /node_modules[/\\]react[/\\]dist[/\\].*/,
  /website\/node_modules\/.*/,
  /heapCapture\/bundle\.js/,
  /.*\/__tests__\/.*/
];

到这个：

var sharedBlacklist = [
  /node_modules[\/\\]react[\/\\]dist[\/\\].*/,
  /website\/node_modules\/.*/,
  /heapCapture\/bundle\.js/,
  /.*\/__tests__\/.*/
];

请注意，如果您运行npm install或yarn install，则需要再次更改代码。