LegacySyncImporter: ((this: LegacyImporterThis, url: string, prev: string) => LegacyImporterResult)

Type declaration

    • (this: LegacyImporterThis, url: string, prev: string): LegacyImporterResult
    • A synchronous callback that implements custom Sass loading logic for @import rules and @use rules. This can be passed to importer for either render or renderSync.

      See importer for more detailed documentation.

      file: "style.scss",
      importer: [
      function(url, prev) {
      if (url != "big-headers") return null;

      return {
      contents: 'h1 { font-size: 40px; }'


      This only works with the legacy render and renderSync APIs. Use Importer with compile, compileString, compileAsync, and compileStringAsync instead.


      • this: LegacyImporterThis
      • url: string

        The @use or @import rule’s URL as a string, exactly as it appears in the stylesheet.

      • prev: string

        A string identifying the stylesheet that contained the @use or @import. This string’s format depends on how that stylesheet was loaded:

        • If the stylesheet was loaded from the filesystem, it’s the absolute path of its file.
        • If the stylesheet was loaded from an importer that returned its contents, it’s the URL of the @use or @import rule that loaded it.
        • If the stylesheet came from the data option, it’s the string "stdin".

      Returns LegacyImporterResult