Type error between Angular CLI and Browserslist when extending a browserslist config

[maharielrosario]

Command

build

Is this a regression?

• Yes, this behavior used to work in the previous version

The previous version in which this bug was not present was

No response

Description

I have a fresh Angular 19 application and I am trying to extend a browserslist configuration from a TS library that I changed to JS while debugging this issue. When I run the Angular build, it throws a type error.

Originally, I opened a ticket with the browserslist team so you can see browserslist/browserslist#891 for further context. I was getting errors with browserslist as they are using CommonJS requires in their code and my library and app were ESM. After removing browserslist-useragent-regexp, simplifying my library to JS, and still getting errors, they asked me to reach out to Angular as they were thinking Angular had an over complicated environment.

Minimal Reproduction

Create a shareable config following browserslist's instructions here: https://github.com/browserslist/browserslist?tab=readme-ov-file#shareable-configs

Here is my particular example with text changed as it's for a client I'm working with:

Snippet of application's package.json:

  "type": "module",
  "browserslist": [
    "extends @scope/browserslist-config-xxxx"
  ]

Here is the library's code for this config:

index.js

const BROWSERSLIST_QUERY = ['defaults'];
export default BROWSERSLIST_QUERY;

snippet of package.json

  "type": "module",
  "browserslist": [
    "extends @scope/browserslist-config-xxxx"
  ]

Exception or Error

[error] TypeError: Cannot read properties of undefined (reading 'length')
    at find (/../node_modules/browserslist/parse.js:12:25)
    at matchBlock (/../node_modules/browserslist/parse.js:46:10)
    at /../node_modules/browserslist/parse.js:73:17
    at Array.map (<anonymous>)
    at parse (/../node_modules/browserslist/parse.js:70:13)
    at parseQueries (/../node_modules/browserslist/index.js:454:16)
    at resolve (/../node_modules/browserslist/index.js:322:10)
    at Function.select (/../node_modules/browserslist/index.js:1163:14)
    at /../node_modules/browserslist/index.js:332:29
    at Array.reduce (<anonymous>)

Your Environment

Angular CLI: 19.2.8
Node: 22.14.0
Package Manager: npm 10.9.2
OS: darwin arm64

Angular: 19.2.7
... common, compiler, compiler-cli, core, forms
... platform-browser, platform-browser-dynamic, router

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1902.8
@angular-devkit/build-angular   19.2.8
@angular-devkit/core            19.2.8
@angular-devkit/schematics      19.2.8
@angular/cli                    19.2.8
@schematics/angular             19.2.8
rxjs                            7.8.2
typescript                      5.7.3
zone.js                         0.15.0

Anything else relevant?

No response

[alan-agius4]

I doubt this issue is caused by the Angular CLI, as it we just call the Browserslist API without much additional handling.

Could you try running npx browserslist in the directory where your .browserslistrc file is located and see if the error still occurs?

[maharielrosario]

Hi @alan-agius4 , I don't have a .browserslistrc file in the app, i'm just using browserslist in the package.json.

But I still ran npx browserslist it and got this:

queries [ 'extends @scope/browserslist-config-xxxx' ]
queries undefined  

[alan-agius4]

I’m unable to replicate the issue. However, running npx browserslist should return the resolved results based on the provided query.

I suggest to setup a runnable reproduction. You can read here why this is needed. A good way to make a minimal repro is to create a new app via ng new repro-app and adding the minimum possible code to show the problem. Then you can push this repository to github and link it here.

This might be related to your directory structure so its really important to get an accurate repro to diagnose this.