Receiving [Browserslist] Could not parse <ProjectDirectory>/ClientApp/package.json when using ASP.NET+React.js template

This issue has been moved from a ticket on Developer Community.

---

[severity:I’m unable to use this version] I have tried creating a sample project using the ASP.NET+React.js template in Visual Studio 2019 for Mac but keep encountering the following error when trying to launch the app:

AggregateException: One or more errors occurred. (One or more errors occurred. (The npm script 'start' exited without indicating that the create-react-app server was listening for requests. The error output was: [Browserslist] Could not parse <ProjectDirectory>/ClientApp/package.json. Ignoring it. ))

System.Threading.Tasks.Task<TResult>. GetResultCore(bool waitCompletionNotification)
System.Threading.Tasks.Task<TResult>.get_Result()
Microsoft.AspNetCore.SpaServices.Extensions.Util.TaskTimeoutExtensions.WithTimeout<T>(Task<T> task, TimeSpan timeoutDelay, string message)
Microsoft.AspNetCore.SpaServices.Extensions.Proxy.SpaProxy.PerformProxyRequest(HttpContext context, HttpClient httpClient, Task<Uri> baseUriTask, CancellationToken applicationStoppingToken, bool proxy404s)
Microsoft.AspNetCore.Builder.SpaProxyingExtensions+<>c__DisplayClass2_0+<<UseProxyToSpaDevelopmentServer>b__0>d.MoveNext()
Microsoft.AspNetCore.Diagnostics.DeveloperExceptionPageMiddleware.Invoke(HttpContext context)

This occurs in both .NET Core 3.1 and .NET 5.0, Node and NPM version output is as follows:

node --version
v17.0.1

npm ---version
8.1.0

Given the exception, I tried changing the following in package.json from this:

"browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
}

To this:

"browserslist": [
      ">0.2%",
      "not dead",
      "not op_mini all"
]

However, this had no impact. Additionally, I tried executing the following command from the ClientApp directory:

npx browserslist --update-db

This still did not resolve the issue. I have a clean install of Node and this issue happens regardless of .NET versions. If anyone could help with this, it would be greatly appreciated.

Thanks

---

Original Comments

Feedback Bot on 11/7/2021, 11:17 PM:

We have directed your feedback to the appropriate engineering team for further evaluation. The team will review the feedback and notify you about the next steps.

Feedback Bot on 11/16/2021, 02:12 AM:

This issue is currently being investigated. Our team will get back to you if either more information is needed, a workaround is available, or the issue is resolved.

---

Original Solutions

(no solutions)

[BrassHead]

The package.json file from the template was saved in “utf8 with BOM”. The BOM causes parsing to fail. Removing the BOM (by creating a new file and copy paste the contents as suggested by @q-omar or using some other tool) will fix the problem.

[q-omar]

I copied the contents of package.json, deleted it, created a new file and pasted the contents. App began working then. I think there was some invisible character that was throwing off the parser 🤷‍♂️