docs: What does the CLI --optimize flag do?

[jmooring]

The CLI help (--help) for v4.1.0 displays the following:

  -m, --minify ·········· Optimize and minify the output
      --optimize ········ Optimize the output without minifying

But I have not found an official explanation of what it means to optimize without minifying.

[wongjn]

Either option calls the following function:

tailwindcss/packages/@tailwindcss-node/src/optimize.ts

Lines 3 to 29 in 6a0a3ec

	export function optimize(
	input: string,
	{ file = 'input.css', minify = false }: { file?: string; minify?: boolean } = {},
	): string {
	function optimize(code: Buffer | Uint8Array) {
	return transform({
	filename: file,
	code: code as any,
	minify,
	sourceMap: false,
	drafts: {
	customMedia: true,
	},
	nonStandard: {
	deepSelectorCombinator: true,
	},
	include: Features.Nesting | Features.MediaQueries,
	exclude: Features.LogicalProperties | Features.DirSelector | Features.LightDark,
	targets: {
	safari: (16 << 16) | (4 << 8),
	ios_saf: (16 << 16) | (4 << 8),
	firefox: 128 << 16,
	chrome: 111 << 16,
	},
	errorRecovery: true,
	}).code
	}

With --minify setting minify to true. This is a Lightning CSS transform() function that transpiles some of the CSS down, such as removing instances of CSS nesting.

[jmooring]

transpiles some of the CSS down

I am looking for a definitive explanation of what that means (i.e., specifically what tasks are performed).

[wongjn]

What is your question @tycobra?

[wongjn]

I've answered that question at a general level at #17507 (comment). Otherwise, for more technical concrete details, consider reviewing lightning CSS's code.