VyriyVyriy Browserslist Config
@vyriy/browserslist-config is a shared Browserslist configuration used across Vyriy projects.
The goal of this package is to keep browser and runtime targets consistent between different parts of the system: local development, client-side production bundles, modern builds, and server-side rendering.
Instead of duplicating Browserslist rules in every project, the configuration can be installed once and reused through .browserslistrc.
Why this config exists
Modern frontend projects often have several different build targets.
For example, a React application may need:
- a fast development build for the latest Chrome;
- a production build for real users and supported browsers;
- an SSR build targeting Node.js;
- a modern build for evergreen browsers.
Keeping these targets in one shared package makes the setup easier to maintain and safer to reuse across projects.
Installation
yarn add @vyriy/browserslist-config browserslist
Usage
Create or update .browserslistrc in your project:
[development]
extends @vyriy/browserslist-config
[ssr]
extends @vyriy/browserslist-config
[production]
extends @vyriy/browserslist-config
[modern]
extends @vyriy/browserslist-config
The same shared config is used for all environments, but Browserslist resolves the actual target list based on the selected environment.
Environments
The config provides several environments for different build scenarios.
Default / Production
The default environment is intended for production client-side bundles.
It targets browsers used by real users and is suitable for normal production builds, CSS processing, Babel transpilation, and other tools that read Browserslist.
npx browserslist --config=.browserslistrc
Output:
and_chr 147
and_ff 150
and_qq 14.9
and_uc 15.5
android 147
chrome 148
chrome 147
chrome 146
chrome 112
edge 147
edge 146
firefox 150
firefox 149
ios_saf 26.4
ios_saf 26.3
ios_saf 26.2
ios_saf 18.5-18.7
kaios 3.0-3.1
kaios 2.5
op_mini all
op_mob 80
opera 131
opera 127
safari 26.4
safari 26.3
samsung 29
samsung 28
Development
The development environment is intentionally small.
It is optimized for local development where build speed and debugging experience are more important than wide browser coverage.
npx browserslist --config=.browserslistrc --env=development
Output:
chrome 148
This keeps local builds faster and easier to debug while still using a realistic modern browser target.
SSR
The ssr environment is used for server-side rendering and server-side build targets.
In Vyriy projects, SSR runs on Node.js, so the Browserslist target is Node instead of browsers.
npx browserslist --config=.browserslistrc --env=ssr
Output:
node 24.15.0
This is useful when tools like Babel or other build steps need to understand that the output is not meant for the browser.
Production
The production environment is the main browser target for public client-side bundles.
It should be used for assets that are shipped to users through CDN, S3, CloudFront, or any other static hosting setup.
npx browserslist --config=.browserslistrc --env=production
Output:
and_chr 147
and_ff 150
and_qq 14.9
and_uc 15.5
android 147
chrome 148
chrome 147
chrome 146
chrome 112
edge 147
edge 146
firefox 150
firefox 149
ios_saf 26.4
ios_saf 26.3
ios_saf 26.2
ios_saf 18.5-18.7
kaios 3.0-3.1
kaios 2.5
op_mini all
op_mob 80
opera 131
opera 127
safari 26.4
safari 26.3
samsung 29
samsung 28
Modern
The modern environment is intended for modern-only builds.
It targets the latest evergreen browsers and can be useful for experiments, internal tools, documentation sites, or separate modern bundles.
npx browserslist --config=.browserslistrc --env=modern
Output:
chrome 148
firefox 150
safari 26.4
Typical usage in Vyriy projects
In a Vyriy-style project, different tools can use different Browserslist environments:
- local development can use
development; - browser production bundles can use
production; - SSR builds can use
ssr; - modern-only builds can use
modern.
This makes the build configuration explicit without spreading browser target rules across multiple repositories.
Notes
Browserslist is used by many frontend tools, including Babel, PostCSS, Autoprefixer, and other build-time utilities.
Because of that, keeping the target list centralized helps avoid small differences between packages, applications, documentation builds, and SSR entry points.
The config is intentionally simple. It does not try to solve every possible browser support strategy. It provides a practical baseline for Vyriy projects and can evolve together with the platform.