[快速解答]

Question

我刚刚安装了node.js和cli
- 已安装node.js
- 已安装react-native-cli
```
npm -g react-native-cli
```
并创建了一个“新项目”。
```
react-native init new_project
```
在该“ new_project”目录中，我厌倦了查看Metro bundler是否运行良好。
```
react-native start
```
但是该命令给了我以下错误，并且Metro无法启动。有任何解决此错误的线索吗？（我使用的是Windows 10操作系统。）
- 命令：C:\projects\new_proj>react-native start
  
  错误无效的正则表达式： /(..fixtures.|node_modules[]react[]dist[].|website\node_modules.|heapCapture\bundle.js|.\tests。)$/：未终止的字符类。使用--verbose标志运行CLI以获取更多详细信息。语法错误：无效的正则表达式：/(.\fixtures.|node_modules[]react[]dist[].|website\node_modules.|heapCapture\bundle.js|.\tests.)$/：未终止的字符类在新的RegExp（）在黑名单中（D：\ projects \ new_proj \ node_modules \ metro-config \ src \ defaults \ blacklist.js：34：10）在getBlacklistRE（D：\ projects \ new_proj \ node_modules \ react-native \ node_modules @ react-native-community \ cli \ build \ tools \ loadMetroConfig.js：69：59）在getDefaultConfig（D：\ projects \ new_proj \ node_modules \ react-native \ node_modules @ react-native-community \ cli \ build \ tools \ loadMetroConfig.js：85：20）加载时（D：\ projects \ new_proj \ node_modules \ react-native \ node_modules @ react-native-community \ cli \ build \ tools \ loadMetroConfig.js：121：25）在Object.runServer上[作为功能]（D：\ projects \ new_proj \ node_modules \ react-native \ node_modules @ react-native-community \ cli \ build \ commands \ server \ runServer.js：82：58）在Command.handleAction（D：\ projects \ new_proj \ node_modules \ react-native \ node_modules @ react-native-community \ cli \ build \ cliEntry.js：160：21）在Command.listener（D：\ projects \ new_proj \ node_modules \ commander \ index.js：315：8）在Command.emit（events.js：210：5）在Command.parseArgs（D：\ projects \ new_proj \ node_modules \ commander \ index.js：651：12）

Answer 1

今天我第一次遇到类似的错误。它出现在\node_modules\metro-config\src\defaults\blacklist.js中，有一个无效的正则表达式需要更改。我将sharedBlacklist下的第一个表达式更改为：

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__\/.*/
];

Answer 2

这是由节点v12.11.0引起的，原因是它处理常规位置的方式有两种解决此问题的方法

方法一

您可以降级到节点v12.10.0，这将应用正确的方法来处理解析错误

方法II

您可以通过更改位于以下位置的文件来正确终止正则表达式：

\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__\/.*/
];

Answer 3

黑名单文件配置不匹配。

要解决这个问题，

我们必须移动到项目文件夹。
打开\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__\/.*/
];

Answer 4

[快速解答]

使用某些NPM和Node版本的Metro出现问题。

您可以解决更改文件\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安装或yarn安装，则需要再次更改代码。

Answer 5

我遇到了同样的问题。

“错误无效的正则表达式：/（。 \ 夹具 \。 | node_modules [\]反应[\] dist [\]。 |网站\ node_modules \。 | heapCapture \ bundle.js |。 \ 测试 \。）$ /：未终止的字符类。“

更改\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__\/.*/
];

此更改解决了我的错误。

Answer 6

我的项目中没有Metro-config，现在怎么办？

我发现在相当老的项目中，metro-config中没有node_modules。如果是这种情况，那么

转到node_modules / metro-bundler / src / 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__\/.*/
];

P.S。我在几个项目中都遇到过同样的情况，所以我认为共享它可能会对某人有所帮助。

修改

根据@beltrone的评论，该文件可能也存在于其中，

node_modules \ metro \ src \ blacklist.js

Answer 7

我遇到了同样的问题，我在项目中更改了E：\ NodeJS \ ReactNativeApp \ ExpoTest \ 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__\/.*/
];

这对我来说很完美

Answer 8

带有修订的PR已合并到metro存储库中。现在我们只需要等待下一个版本。目前，最好的选择是降级到NodeJS v12.10.0。正如Brandon所指出的那样，在node_modules/中进行任何修改都是不正确的做法，并且不是最终解决方案。

Answer 9

解决方案很简单，但只是暂时的...

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

那么，我们如何自动运行它？

永久解决方案

要在安装节点模块后“自动”执行此操作，可以使用patch-package。

修复metro-config文件，解决错误：

文件显示在\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__\/.*/
];

然后，生成一个永久补丁文件：

npx patch-package metro-config

在您的package.json中触发补丁：

"scripts": {
+  "postinstall": "npx patch-package"
}

全部完成！现在，此修补程序将在每个npm install / yarn install进行。

感谢https://github.com/ds300/patch-package

Answer 10

您有两种解决方案：

您可以将节点降级到V12.10.0，也可以为要创建的每个项目修改此文件。

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__\/.*/
];

Answer 11

今天我遇到了这个问题，但上面的这些答案都不适用于我，因为本地更改/修补 node_modules 或添加仅由纱线处理的分辨率永远不会成为我的解决方案，无论是短期还是其他。

一点也不奇怪，package.json 只需要获取一些更新的依赖版本，所以我点击了 cli，切换到 package.json 所在的项目目录，然后这些行完成了这项工作：

npm install -g npm-check-updates
ncu -u
npm 安装

第一行全局安装一个工具，它简单地列出了 package.json 提供的所有 (dev-)deps，您可以升级它们。第二个命令自动调整 package.json 中的版本号。最后一行重新安装节点模块 - 使用“yarn”而不是“npm install”也完全没问题。

现在 react-native 可以正常工作了。

Answer 12

上面提到的所有评论都很棒，与我分享了需要编辑的黑名单文件的工作路径：

“您的项目名称\ node_modules \ metro-bundler \ src”文件名“ blacklist.js”

Answer 13

我刚刚将package.json更新为

"react-native": "https://github.com/expo/react-native/archive/sdk-35.0.0.tar.gz"

到

"react-native": "https://github.com/expo/react-native/archive/sdk-36.0.0.tar.gz"

似乎在 sdk-36 中不会发生此问题！

我的节点版本为 v12.16.0 ，操作系统为 win10 。

Answer 14

在Windows 10上，我强烈建议安装Linux Bash Shell。

以下是设置它的不错的指南： https://www.howtogeek.com/249966/how-to-install-and-use-the-linux-bash-shell-on-windows-10/

只需按照以下步骤操作，选择您的linux发行版，并避免由于明显的不稳定而在cmd上尽可能多地使用节点。

请注意，Microsoft强烈警告不要使用Windows软件添加或修改Linux文件，如下所述： howtogeek.com/261383/how-to-access-your-ubuntu-bash-files-in-windows-and-your-windows-system-drive-in-bash/

希望有帮助！

Answer 15

https://github.com/facebook/metro/issues/453

对于谁仍然没有react-native，expo中的官方补丁就得到此错误的人

使用yarn并将此设置添加到package.json

{
  ...
  "resolutions": {
    "metro-config": "bluelovers/metro-config-hotfix-0.56.x"
  },
 ...

Answer 16

select sum(january)
from t
where date >= :datestart and date < :dateend

以这种方式工作是否可以将其变成全局变量？还是应该修改每个新项目？

Answer 17

我发现regexp.source已从CornerRadius更改，可能是由新的node v12.11.0引擎引起的。进一步了解https://github.com/nodejs/node/releases/tag/v12.11.0。

v8

Answer 18

转到

\ node_modules \ metro-config \ src \ defaults \ blacklist.js

并替换

rightBarButtonItem

到

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

这不是最佳实践，我的建议是：将节点版本降级为12.9或更新Metro-config，因为它们已解决了节点问题。

Answer 19

转到项目目录中的node_modules，查找metro-config \ src \ defaults \ blacklist.js并更改var blacklist: = {....} 到

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

Answer 20

通过安装最新版本（目前为0.57.0）的metro-config修复，他们已解决了该问题：

npm安装Metro-config

您可以稍后在本机人员更新模块版本后将其删除

Answer 21

你可以去...

\ 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__\/.*/
];

Answer 22

通常，我不会修改node_modules/中的文件（或任何未提交为存储库一部分的文件），因为下一次清理，构建或更新将使它们退化。我过去肯定是这样做的，这使我难过几次。但这确实是一个短期/本地开发修复程序，直到/除非更新metro-config。

谢谢！

如何解决“反应本机启动”上的错误

22 个答案:

[快速解答]

我的项目中没有Metro-config，现在怎么办？

解决方案很简单，但只是暂时的...

永久解决方案