I have a hard time with configuration. I went ahead with the default config but found

(config question, not a bug) Config: default + Safari 14 support about lightningcss HOT 4 OPEN

etsystoyan commented on June 9, 2024

(config question, not a bug) Config: default + Safari 14 support

from lightningcss.

Comments (4)

mischnic commented on June 9, 2024

all the smart lightningcss defaults

Something is providing a default browserslist target list to Lightning CSS, so it really depends on how you're running Lightning CSS (as part of another build tool?)

Once you know that current value, you can just add your Safari range to it.

So it might just be that your browserslist config should be defaults, Safari >= 14

from lightningcss.

etsystoyan commented on June 9, 2024

I'm running it standalone from the CLI (and as a node library), so for example this is the default:

lightningcss --minify --error-recovery before.css -o after.css

then

lightningcss --minify --targets 'defaults' --error-recovery before.css -o after.css

... gives me a different output than no targets at all

One difference I see is when I specify a Safari >= 14 target a lot of old -webkit- prefixes are stripped. And these are kept when no target is given (LightningCSS defaults). I think this is cool, but makes me slightly nervous that default LightningCSS keeps them. Even though LightningCSS seems to assume a newer Safari by default (e.g. using inset property which is not in Safari 14)

Once you know that current value, you can just add your Safari range to it.

My plan exactly, except I cannot figure out that current value

from lightningcss.

mischnic commented on June 9, 2024

Strange, it should by default use defaults in that case according to this comment:

lightningcss/src/targets.rs

Lines 54 to 74 in baa1a2b

 /// Finds browserslist configuration, selects queries by environment and loads the resulting queries into LightningCSS targets. 

 /// 

 /// Configuration resolution is modeled after the original `browserslist` nodeJS package. 

 /// The configuration is resolved in the following order: 

 /// 

 /// - If a `BROWSERSLIST` environment variable is present, then load targets from its value. This is analog to the `--targets` CLI option. 

 /// Example: `BROWSERSLIST="firefox ESR" lightningcss [OPTIONS] <INPUT_FILE>` 

 /// - If a `BROWSERSLIST_CONFIG` environment variable is present, then resolve the file at the provided path. 

 /// Then parse and use targets from `package.json` or any browserslist configuration file pointed to by the environment variable. 

 /// Example: `BROWSERSLIST_CONFIG="../config/browserslist" lightningcss [OPTIONS] <INPUT_FILE>` 

 /// - If none of the above apply, then find, parse and use targets from the first `browserslist`, `.browserslistrc` 

 /// or `package.json` configuration file in any parent directory. 

 /// 

 /// When using parsed configuration from `browserslist`, `.browserslistrc` or `package.json` configuration files, 

 /// the environment determined by: 

 /// 

 /// - the `BROWSERSLIST_ENV` environment variable if present, 

 /// - otherwise the `NODE_ENV` environment varialbe if present, 

 /// - otherwise `production` is used. 

 /// 

 /// If no targets are found for the resulting environment, then the `defaults` configuration section is used.

from lightningcss.

etsystoyan commented on June 9, 2024

Interesting, I thought it's last 10 browser versions and further tweaking, happening during build time:

lightningcss/scripts/build-prefixes.js

Lines 33 to 42 in baa1a2b

 const latestBrowserVersions = {}; 

 for (let b in browsers) { 

 let versions = browsers[b].versions.slice(-10); 

 for (let i = versions.length - 1; i >= 0; i--) { 

 if (versions[i] != null && versions[i] != "all" && versions[i] != "TP") { 

 latestBrowserVersions[b] = versions[i]; 

 break; 

 } 

 } 

 }

from lightningcss.

(config question, not a bug) Config: default + Safari 14 support about lightningcss HOT 4 OPEN

Comments (4)

Related Issues (20)

Recommend Projects

React

Vue.js

Typescript

TensorFlow

Django

Laravel

D3

Recommend Topics

javascript

web

server

Machine learning

Visualization

Game

Recommend Org

Facebook

Microsoft

Google

Alibaba

D3

Tencent

	/// Finds browserslist configuration, selects queries by environment and loads the resulting queries into LightningCSS targets.
	///
	/// Configuration resolution is modeled after the original `browserslist` nodeJS package.
	/// The configuration is resolved in the following order:
	///
	/// - If a `BROWSERSLIST` environment variable is present, then load targets from its value. This is analog to the `--targets` CLI option.
	/// Example: `BROWSERSLIST="firefox ESR" lightningcss [OPTIONS] <INPUT_FILE>`
	/// - If a `BROWSERSLIST_CONFIG` environment variable is present, then resolve the file at the provided path.
	/// Then parse and use targets from `package.json` or any browserslist configuration file pointed to by the environment variable.
	/// Example: `BROWSERSLIST_CONFIG="../config/browserslist" lightningcss [OPTIONS] <INPUT_FILE>`
	/// - If none of the above apply, then find, parse and use targets from the first `browserslist`, `.browserslistrc`
	/// or `package.json` configuration file in any parent directory.
	///
	/// When using parsed configuration from `browserslist`, `.browserslistrc` or `package.json` configuration files,
	/// the environment determined by:
	///
	/// - the `BROWSERSLIST_ENV` environment variable if present,
	/// - otherwise the `NODE_ENV` environment varialbe if present,
	/// - otherwise `production` is used.
	///
	/// If no targets are found for the resulting environment, then the `defaults` configuration section is used.

	const latestBrowserVersions = {};
	for (let b in browsers) {
	let versions = browsers[b].versions.slice(-10);
	for (let i = versions.length - 1; i >= 0; i--) {
	if (versions[i] != null && versions[i] != "all" && versions[i] != "TP") {
	latestBrowserVersions[b] = versions[i];
	break;
	}
	}
	}