NodePackageImporter

互換性

Dart Sass

1.71.0 以降

Node Sass

✗

組み込みの Node.js パッケージインポータ。これは、標準の Node.js 解決アルゴリズムに従って node_modules から pkg: URL をロードします。

Node.js パッケージインポータは、importers オプションに追加できるクラスとして公開されます。

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

Sass パッケージの作成

パッケージ作成者は、package.json マニフェストを通じてユーザーに公開するものを制御できます。推奨される方法は、package.json に sass 条件付きエクスポートを追加することです。

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

これにより、パッケージユーザーは、@use "pkg:uicomponents" と記述して、node_modules/uicomponents/src/scss/index.scss にあるファイルをロードできます。

Node.js パッケージインポータは、Node.js のパッケージエントリポイントでサポートされているさまざまな形式をサポートしており、作成者は複数のサブパスを公開できます。

// 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

これにより、パッケージユーザーは以下を記述できます。

• ルートエクスポートをインポートするには、@use "pkg:uicomponents";。
• カラーパーシャルをインポートするには、@use "pkg:uicomponents/colors";。
• 紫のテーマをインポートするには、@use "pkg:uicomponents/theme/purple";。

ライブラリユーザーは、インポータがパーシャル、インデックスファイル、および拡張機能を解決することに依存できますが、ライブラリ作成者は exports でファイルパス全体を指定する必要があります。

sass 条件に加えて、style 条件も使用できます。Sass は、関連するファイルタイプの場合、default 条件に一致しますが、作成者はこれに依存しないことを推奨します。特に、キーの順序が重要であり、インポータは sass、style、または default のキーを持つ最初の値に解決するため、常に default を最後に配置する必要があります。

exports フィールドを使用したパッケージエントリポイントへの移行をまだ行っていないパッケージ作成者を支援するために、Node.js パッケージインポータはいくつかのフォールバックオプションを提供します。pkg: URL にサブパスがない場合、Node.js パッケージインポータは package.json のルートで sass または style キーを探します。

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

これにより、ユーザーは @use "pkg:uicomponents"; と記述して、index.scss ファイルをインポートできます。

最後に、Node.js パッケージインポータは、パッケージルートで index ファイルを探し、パーシャルと拡張機能を解決します。たとえば、ファイル _index.scss が uicomponents のパッケージルートに存在する場合、ユーザーは @use "pkg:uicomponents"; でインポートできます。

pkg: URL にパッケージエントリポイントに一致するサブパスが含まれていない場合、Node.js インポータは、ファイル拡張子、パーシャル、およびインデックスファイルを解決しながら、パッケージルートを基準にしてそのファイルを見つけようとします。たとえば、ファイル src/sass/_colors.scss が uicomponents パッケージに存在する場合、ユーザーは @use "pkg:uicomponents/src/sass/colors"; を使用してそのファイルをインポートできます。