refactor(@angular/build): reduce inline style language value per call usage

The configured inline style language for Angular components is now set during
the construction of the component stylesheet bundler. This avoids needing to
repeatedly pass the value into each inline bundling call. The ability to
customize the language per call is retained to allow individual style control
if needed.
This commit is contained in:
Charles Lyding 2024-10-09 16:27:41 -04:00 committed by Charles
parent c48d6947ed
commit ac8f81e9d4
3 changed files with 11 additions and 10 deletions

View File

@ -130,6 +130,7 @@ export function createCompilerPlugin(
// Track incremental component stylesheet builds
const stylesheetBundler = new ComponentStylesheetBundler(
styleOptions,
styleOptions.inlineStyleLanguage,
pluginOptions.incremental,
);
let sharedTSCompilationState: SharedTSCompilationState | undefined;
@ -190,8 +191,8 @@ export function createCompilerPlugin(
stylesheetResult = await stylesheetBundler.bundleInline(
data,
containingFile,
// Inline stylesheets from a template style element are always CSS
containingFile.endsWith('.html') ? 'css' : styleOptions.inlineStyleLanguage,
// Inline stylesheets from a template style element are always CSS; Otherwise, use default.
containingFile.endsWith('.html') ? 'css' : undefined,
// When external runtime styles are enabled, an identifier for the style that does not change
// based on the content is required to avoid emitted JS code changes. Any JS code changes will
// invalid the output and force a full page reload for HMR cases. The containing file and order
@ -490,7 +491,6 @@ export function createCompilerPlugin(
build,
stylesheetBundler,
additionalResults,
styleOptions.inlineStyleLanguage,
pluginOptions.loadResultCache,
);
}

View File

@ -33,6 +33,7 @@ export class ComponentStylesheetBundler {
*/
constructor(
private readonly options: BundleStylesheetOptions,
private readonly defaultInlineLanguage: string,
private readonly incremental: boolean,
) {}
@ -63,7 +64,12 @@ export class ComponentStylesheetBundler {
);
}
async bundleInline(data: string, filename: string, language: string, externalId?: string) {
async bundleInline(
data: string,
filename: string,
language = this.defaultInlineLanguage,
externalId?: string,
) {
// Use a hash of the inline stylesheet content to ensure a consistent identifier. External stylesheets will resolve
// to the actual stylesheet file path.
// TODO: Consider xxhash instead for hashing

View File

@ -66,7 +66,6 @@ export function setupJitPluginCallbacks(
build: PluginBuild,
stylesheetBundler: ComponentStylesheetBundler,
additionalResultFiles: Map<string, { outputFiles?: OutputFile[]; metafile?: Metafile }>,
inlineStyleLanguage: string,
loadCache?: LoadResultCache,
): void {
const root = build.initialOptions.absWorkingDir ?? '';
@ -114,11 +113,7 @@ export function setupJitPluginCallbacks(
if (entry.contents === undefined) {
stylesheetResult = await stylesheetBundler.bundleFile(entry.path);
} else {
stylesheetResult = await stylesheetBundler.bundleInline(
entry.contents,
entry.path,
inlineStyleLanguage,
);
stylesheetResult = await stylesheetBundler.bundleInline(entry.contents, entry.path);
}
const { contents, outputFiles, errors, warnings, metafile, referencedFiles } =