NodePackageImporter

Kompatibilität

Dart Sass

seit 1.71.0

Node Sass

✗

Der integrierte Node.js-Paket-Importer. Dieser lädt pkg:-URLs aus node_modules gemäß dem Standard-Auflösungsalgorithmus von Node.js.

Ein Node.js-Paket-Importer wird als Klasse bereitgestellt, die zur Option importers hinzugefügt werden kann.

const sass = require('sass');
sass.compileString('@use "pkg:vuetify', {
  importers: [new sass.NodePackageImporter()]
});
Copy

Sass-Pakete schreiben

Paketautoren können steuern, was ihren Benutzern über ihr package.json-Manifest zur Verfügung gestellt wird. Die empfohlene Methode ist, eine sass-bedingte Exportfunktion zu package.json hinzuzufügen.

// node_modules/uicomponents/package.json
{
  "exports": {
    ".": {
      "sass": "./src/scss/index.scss",
      "import": "./dist/js/index.mjs",
      "default": "./dist/js/index.js"
    }
  }
}
Copy

Dies ermöglicht es einem Paketbenutzer, @use "pkg:uicomponents" zu schreiben, um die Datei unter node_modules/uicomponents/src/scss/index.scss zu laden.

Der Node.js-Paket-Importer unterstützt die verschiedenen Formate, die von den Paketeinstiegspunkten von Node.js unterstützt werden, sodass Autoren mehrere Unterpfade verfügbar machen können.

// node_modules/uicomponents/package.json
{
  "exports": {
    ".": {
      "sass": "./src/scss/index.scss",
    },
    "./colors.scss": {
      "sass": "./src/scss/_colors.scss",
    },
    "./theme/*.scss": {
      "sass": "./src/scss/theme/*.scss",
    },
  }
}
Copy

Dies ermöglicht es einem Paketbenutzer,

• @use "pkg:uicomponents"; zu schreiben, um den Root-Export zu importieren.
• @use "pkg:uicomponents/colors"; zu schreiben, um das Farben-Partial zu importieren.
• @use "pkg:uicomponents/theme/purple"; zu schreiben, um ein lila Theme zu importieren.

Beachten Sie, dass zwar Bibliotheksbenutzer sich darauf verlassen können, dass der Importer Partials, Index-Dateien und Erweiterungen auflöst, Bibliotheksautoren jedoch den vollständigen Dateipfad in exports angeben müssen.

Zusätzlich zur sass-Bedingung ist auch die style-Bedingung akzeptabel. Sass wird die default-Bedingung abgleichen, wenn es sich um einen relevanten Dateityp handelt, aber Autoren wird davon abgeraten, sich darauf zu verlassen. Insbesondere ist die Reihenfolge der Schlüssel wichtig, und der Importer wird zum ersten Wert mit einem Schlüssel aufgelöst, der sass, style oder default ist, sodass Sie default immer zuletzt setzen sollten.

Um Paketautoren zu helfen, die noch nicht auf Paketeinstiegspunkte mit dem exports-Feld umgestiegen sind, bietet der Node.js-Paket-Importer mehrere Fallback-Optionen. Wenn die pkg:-URL keinen Unterpfad hat, sucht der Node.js-Paket-Importer nach einem sass- oder style-Schlüssel am Stammverzeichnis von package.json.

// node_modules/uicomponents/package.json
{
  "sass": "./src/scss/index.scss",
}
Copy

Dies ermöglicht es einem Benutzer, @use "pkg:uicomponents"; zu schreiben, um die Datei index.scss zu importieren.

Schließlich sucht der Node.js-Paket-Importer nach einer index-Datei im Paketstammverzeichnis und löst Partials und Erweiterungen auf. Wenn beispielsweise die Datei _index.scss im Paketstammverzeichnis von uicomponents existiert, kann ein Benutzer diese mit @use "pkg:uicomponents"; importieren.

Wenn eine pkg:-URL einen Unterpfad enthält, der keine Übereinstimmung in den Paketeinstiegspunkten hat, versucht der Node.js-Importer, diese Datei relativ zum Paketstammverzeichnis zu finden und löst Dateierweiterungen, Partials und Index-Dateien auf. Wenn beispielsweise die Datei src/sass/_colors.scss im Paket uicomponents existiert, kann ein Benutzer diese Datei mit @use "pkg:uicomponents/src/sass/colors"; importieren.