Graham/angular-cli
1
0
Fork 0
mirror of https://github.com/angular/angular-cli.git synced 2025-05-15 01:54:04 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat(@angular/build): Support Sass package importers

Browse Source 
Enhanced Sass integration by adding support for package importers.

See: https://sass-lang.com/blog/announcing-pkg-importers/

Closes: #29854
This commit is contained in:
Alan Agius 2025-03-14 14:48:44 +00:00
parent 27fe5dad62
commit f4be831197
3 changed files with 39 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
packages/angular/build/src/tools/esbuild/stylesheets/sass-language.ts
View File

@ -43,7 +43,8 @@ export const SassStylesheetLanguage = Object.freeze<StylesheetLanguage>({
resolveDir = dirname(fileURLToPath(options.containingUrl));
}
const result = await build.resolve(url, {
const path = url.startsWith('pkg:') ? url.slice(4) : url;
const result = await build.resolve(path, {
kind: 'import-rule',
resolveDir,
});
@ -56,8 +57,8 @@ export const SassStylesheetLanguage = Object.freeze<StylesheetLanguage>({
});
function parsePackageName(url: string): { packageName: string; readonly pathSegments: string[] } {
const parts = url.split('/');
const hasScope = parts.length >= 2 && parts[0].startsWith('@');
const parts = (url.startsWith('pkg:') ? url.slice(4) : url).split('/');
const hasScope = parts.length >= 2 && parts[0][0] === '@';
const [nameOrScope, nameOrFirstPath, ...pathPart] = parts;
const packageName = hasScope ? `${nameOrScope}/${nameOrFirstPath}` : nameOrScope;

1
tests/legacy-cli/e2e.bzl
View File

@ -46,6 +46,7 @@ WEBPACK_IGNORE_TESTS = [
"tests/i18n/ivy-localize-app-shell.js",
"tests/i18n/ivy-localize-app-shell-service-worker.js",
"tests/commands/serve/ssr-http-requests-assets.js",
"tests/build/styles/sass-pkg-importer.js",
"tests/build/prerender/http-requests-assets.js",
"tests/build/prerender/error-with-sourcemaps.js",
"tests/build/server-rendering/server-routes-*",

34
tests/legacy-cli/e2e/tests/build/styles/sass-pkg-importer.ts Normal file
View File

@ -0,0 +1,34 @@
import assert from 'node:assert';
import { writeFile } from '../../../utils/fs';
import { getActivePackageManager, uninstallPackage } from '../../../utils/packages';
import { ng } from '../../../utils/process';
import { isPrereleaseCli, updateJsonFile } from '../../../utils/project';
import { appendFile } from 'node:fs/promises';
import { getGlobalVariable } from '../../../utils/env';
export default async function () {
assert(
getGlobalVariable('argv')['esbuild'],
'This test should not be called in the Webpack suite.',
);
// forcibly remove in case another test doesn't clean itself up
await uninstallPackage('@angular/material');
const isPrerelease = await isPrereleaseCli();
const tag = isPrerelease ? '@next' : '';
if (getActivePackageManager() === 'npm') {
await appendFile('.npmrc', '\nlegacy-peer-deps=true');
}
await ng('add', `@angular/material${tag}`, '--skip-confirmation');
await Promise.all([
updateJsonFile('angular.json', (workspaceJson) => {
const appArchitect = workspaceJson.projects['test-project'].architect;
appArchitect.build.options.styles = ['src/styles.scss'];
}),
writeFile('src/styles.scss', `@use 'pkg:@angular/material' as mat;`),
]);
await ng('build');
}