简体   繁体   English

启动时创建反应应用程序“编译失败”

[英]create-react-app "Failed to compile" on start up

I am getting the following error when using npm start to open create-react-app.使用npm start 打开 create-react-app 时出现以下错误。 I'm new to React and I have had no problems the past few days doing the command line to make a new app.我是 React 的新手,在过去的几天里,我在命令行制作新应用程序时没有遇到任何问题。

I have tried npx start, npm start and installed npm again for the updated version.我已经尝试了npx start、 npm start 并再次安装了npm以获得更新版本。

Failed to compile
./src/index.css (./node_modules/css-loader/dist/cjs.js??ref--6-oneOf-3-1!./node_modules/postcss-loader/src??postcss!./src/index.css)
BrowserslistError: Unknown browser query `android all`. Maybe you are using old Browserslist or made typo in query.
    at Array.reduce (<anonymous>)
    at Array.some (<anonymous>)
    at Array.filter (<anonymous>)

It is a new bug in BrowserList.这是 BrowserList 中的一个新错误。

There are new reports on this both in create-react-app: https://github.com/facebook/create-react-app/issues/7239在 create-react-app 中都有关于此的新报告: https ://github.com/facebook/create-react-app/issues/7239

and in browserlist: https://github.com/browserslist/browserslist/issues/382#issuecomment-502991170并在浏览器列表中: https ://github.com/browserslist/browserslist/issues/382#issuecomment-502991170

As suggested by John Forbes below the workaround given on the github issue is to change the browserslist entry in package.json to正如约翰福布斯所建议的那样,在 github 问题上给出的解决方法是将 package.json 中的 browserslist 条目更改为

"browserslist": []

This will build and run the project.这将构建并运行该项目。

As proper temporal solution till bug fixing: add to package.json this:在错误修复之前作为适当的临时解决方案:添加到 package.json 中:

  "resolutions": {
    "browserslist": "4.6.2",
    "caniuse-lite": "1.0.30000974"
  },

At the moment you can try this and wait for further fix目前你可以试试这个,等待进一步的修复

"browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [  
    ]
  }

I can confirm that forcing a yarn resolution for caniuse-lite@1.0.30000974 fixes the error.我可以确认为 caniuse-lite@1.0.30000974 强制使用纱线分辨率可以修复错误。 It must be an issue with the latest caniuse-lite@1.0.30000975 release.这一定是最新版 caniuse-lite@1.0.30000975 的问题。

temporary solution:临时解决方案:

In package.json add在 package.json 添加

"resolutions": { "browserslist": "4.6.2", "caniuse-lite": "1.0.30000974" }, “决议”:{“浏览器列表”:“4.6.2”,“caniuse-lite”:“1.0.30000974”},

This method solved my problem.这种方法解决了我的问题。

I tried updating the browserlist and then did this.我尝试更新browserlist ,然后执行此操作。

  1. Delete this part in package.jsonpackage.json中删除这部分
    "browserslist": {
        "production": [
          ">0.2%",
          "not dead",
          "not op_mini all"
        ],
  1. And run npm start并运行npm start

  2. It will ask for yes or no, give yes它会询问是或否,给出是

Solved!解决了!

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM