fix: warn on boolean compilerOptions.css (#8710)

* warn on boolean compilerOptions.css

* changeset

Author: gtm-nayan

.changeset/stale-cougars-wink.md

@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+warn on boolean compilerOptions.css

packages/svelte/src/compiler/compile/index.js

@@ -37,6 +37,7 @@ const regex_valid_identifier = /^[a-zA-Z_$][a-zA-Z_$0-9]*$/;
 const regex_starts_with_lowercase_character = /^[a-z]/;
 
 let warned_of_format = false;
+let warned_boolean_css = false;
 
 /**
  * @param {import('../interfaces.js').CompileOptions} options
@@ -86,23 +87,23 @@ function validate_options(options, warnings) {
 			toString: () => message
 		});
 	}
-	if (valid_css_values.indexOf(css) === -1) {
-		throw new Error(
-			`options.css must be true, false, 'injected', 'external', or 'none' (got '${css}')`
-		);
-	}
+
 	if (css === true || css === false) {
 		options.css = css === true ? 'injected' : 'external';
-		// possibly show this warning once we decided how Svelte 4 looks like
-		// const message = `options.css as a boolean is deprecated. Use '${options.css}' instead of ${css}.`;
-		// warnings.push({
-		// 	code: 'options-css-boolean-deprecated',
-		// 	message,
-		// 	filename,
-		// 	toString: () => message
-		// });
-		// }
+		if (!warned_boolean_css) {
+			console.warn(
+				`compilerOptions.css as a boolean is deprecated. Use '${options.css}' instead of ${css}.`
+			);
+			warned_boolean_css = true;
+		}
+	}
+
+	if (!valid_css_values.includes(options.css)) {
+		throw new Error(
+			`compilerOptions.css must be 'injected', 'external' or 'none' (got '${options.css}').`
+		);
 	}
+
 	if (namespace && valid_namespaces.indexOf(namespace) === -1) {
 		const match = fuzzymatch(namespace, valid_namespaces);
 		if (match) {