build: import sass

Author: alexfriesen

tools/sass/compiler-main.ts

@@ -2,13 +2,10 @@ import * as worker from '@bazel/worker';
 import * as fs from 'fs';
 import * as path from 'path';
 import yargs from 'yargs';
+import {OutputStyle, compile} from 'sass';
 
 import {createLocalAngularPackageImporter} from './local-sass-importer';
 
-// TODO: Switch to normal import when https://github.com/sass/dart-sass/issues/1714 is fixed.
-// Also re-add the `as XX` type narrowing below.
-const sass = require('sass') as any;
-
 const workerArgs = process.argv.slice(2);
 
 // Note: This path is relative to the current working directory as build actions
@@ -63,8 +60,8 @@ async function processBuildAction(args: string[]) {
     .option('style', {type: 'string'})
     .parseAsync();
 
-  const result = sass.compile(inputExecpath, {
-    style: style, // TODO: Re-add: as sass.OutputStyle,
+  const result = compile(inputExecpath, {
+    style: style as OutputStyle,
     sourceMap,
     sourceMapIncludeSources: embedSources,
     loadPaths: loadPath,

tools/sass/local-sass-importer.ts

@@ -1,8 +1,6 @@
 import {pathToFileURL} from 'url';
 import {join} from 'path';
-
-// TODO: Add explicit type for `Sass.FileImporter` once
-//  https://github.com/sass/dart-sass/issues/1714 is fixed.
+import {FileImporter} from 'sass';
 
 /** Prefix indicating Angular-owned Sass imports. */
 const angularPrefix = '@angular/';
@@ -11,7 +9,7 @@ const angularPrefix = '@angular/';
  * Creates a Sass `FileImporter` that resolves `@angular/<..>` packages to the
  * specified local packages directory.
  */
-export function createLocalAngularPackageImporter(packageDirAbsPath: string) {
+export function createLocalAngularPackageImporter(packageDirAbsPath: string): FileImporter {
   return {
     findFileUrl: (url: string) => {
       if (url.startsWith(angularPrefix)) {