From: Julien Déramond Date: Sat, 21 Mar 2026 16:03:57 +0000 (+0100) Subject: Define `.browserslistrc` as the single source of truth and embed it in npm package... X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=339f94d5c498d7d08f95389cbfd156dae0f8379f;p=thirdparty%2Fbootstrap.git Define `.browserslistrc` as the single source of truth and embed it in npm package (#42195) --- diff --git a/.bundlewatch.config.json b/.bundlewatch.config.json index 305ddefb56..112e609210 100644 --- a/.bundlewatch.config.json +++ b/.bundlewatch.config.json @@ -14,7 +14,7 @@ }, { "path": "./dist/css/bootstrap-reboot.min.css", - "maxSize": "5.0 kB" + "maxSize": "5.25 kB" }, { "path": "./dist/css/bootstrap-utilities.css", diff --git a/build/css-minify.mjs b/build/css-minify.mjs index 317f9f1425..6f1d112aa3 100644 --- a/build/css-minify.mjs +++ b/build/css-minify.mjs @@ -17,8 +17,17 @@ const distDir = path.join(process.cwd(), 'dist/css') const cssFiles = fs.readdirSync(distDir) .filter(file => file.endsWith('.css') && !file.endsWith('.min.css')) -// Target browsers (matching Bootstrap's browser support) -const targets = browserslistToTargets(['> 0.5%', 'last 2 versions', 'Firefox ESR', 'not dead']) +// Target browsers (read from .browserslistrc when available) +let targets +try { + // eslint-disable-next-line import/no-extraneous-dependencies + const { default: browserslist } = await import('browserslist') + const browsers = browserslist() + console.log('Target browsers from .browserslistrc:', browsers) + targets = browserslistToTargets(browsers) +} catch { + console.error('Could not load browserslist') +} for (const file of cssFiles) { const inputPath = path.join(distDir, file) diff --git a/package.json b/package.json index ef21e20c0d..a77bafd54d 100644 --- a/package.json +++ b/package.json @@ -199,7 +199,8 @@ "js/{src,dist}/**/*.{js,map}", "js/index.js", "scss/**/*.scss", - "!scss/tests/**" + "!scss/tests/**", + ".browserslistrc" ], "overrides": { "volar-service-emmet": "0.0.63" diff --git a/site/src/content/docs/customize/optimize.mdx b/site/src/content/docs/customize/optimize.mdx index b473bc8c21..677aeaeaae 100644 --- a/site/src/content/docs/customize/optimize.mdx +++ b/site/src/content/docs/customize/optimize.mdx @@ -48,7 +48,7 @@ const dialog = new Dialog(document.getElementById('myDialog')) ## Autoprefixer .browserslistrc -Bootstrap depends on Autoprefixer to automatically add browser prefixes to certain CSS properties. Prefixes are dictated by our `.browserslistrc` file, found in the root of the Bootstrap repo. Customizing this list of browsers and recompiling the Sass will automatically remove some CSS from your compiled CSS, if there are vendor prefixes unique to that browser or version. +Bootstrap depends on Autoprefixer to automatically add browser prefixes to certain CSS properties. Prefixes are dictated by our `.browserslistrc` file, found in the root of the Bootstrap repo and at the root of the npm package (`node_modules/bootstrap/.browserslistrc`). Customizing this list of browsers and recompiling the Sass will automatically remove some CSS from your compiled CSS, if there are vendor prefixes unique to that browser or version. ## Unused CSS diff --git a/site/src/content/docs/getting-started/approach.mdx b/site/src/content/docs/getting-started/approach.mdx index 98c33fa0e2..bd37ad4420 100644 --- a/site/src/content/docs/getting-started/approach.mdx +++ b/site/src/content/docs/getting-started/approach.mdx @@ -139,6 +139,8 @@ You can find our supported range of browsers and their versions [in our `.browse +If you installed Bootstrap via npm, you can also find this file locally at `node_modules/bootstrap/.browserslistrc`. + We use [Autoprefixer](https://github.com/postcss/autoprefixer) to handle intended browser support via CSS prefixes, which uses [Browserslist](https://github.com/browserslist/browserslist) to manage these browser versions. Consult their documentation for how to integrate these tools into your projects. ## Guiding principles diff --git a/site/src/content/docs/getting-started/install.mdx b/site/src/content/docs/getting-started/install.mdx index 5dbe3c5169..5f64637e81 100644 --- a/site/src/content/docs/getting-started/install.mdx +++ b/site/src/content/docs/getting-started/install.mdx @@ -41,6 +41,7 @@ Bootstrap’s `package.json` contains some additional metadata under the followi - `sass` - path to Bootstrap’s main [Sass](https://sass-lang.com/) source file - `style` - path to Bootstrap’s non-minified CSS that’s been compiled using the default settings (no customization) +- `.browserslistrc` - shipped at the package root for Browserslist/Autoprefixer browser targets ### Using Yarn