BrowserslistError: Unknown browser query `dead` in Angular with Sanity

This is a common issue when integrating Sanity with Angular, and the good news is it has a straightforward fix!

The BrowserslistError: Unknown browser query 'dead' error occurs because of a mismatch between your project's Browserslist configuration and the version of Browserslist being used. The query not dead (or just dead) is a Browserslist feature that filters out browsers without official support or updates in the last 24 months.

The Solution:

As discovered in this community thread, you need to remove or update the problematic line in your Browserslist configuration. Here's what to do:

1. Locate your Browserslist configuration - This is typically in one of two places:

   • A .browserslistrc file in your project root
   • A browserslist field in your package.json

2. Remove or update the line - Look for a line that says not dead or just dead and either:

   • Remove it entirely
   • Update your Browserslist package to a newer version that supports this query

Why this happens:

This usually occurs when you have an older version of the browserslist package that doesn't recognize the dead query keyword. The Angular CLI and Sanity's build tools both rely on Browserslist to determine which browsers to support when transpiling code.

Alternative fix:

If you want to keep the not dead query (which is actually a good practice for excluding outdated browsers), you can update your browserslist package:

npm install browserslist@latest --save-dev

Then try running your Angular app again. This should resolve the error while maintaining the browser filtering functionality.

After making either change, restart your development server and the error should be gone!