2024-4-8

package.jsonのstyleフィールド

今日とあるパッケージのソースコードを読んでいたらstyleというフィールドがあるpackage.jsonを見かけた。

少なくともnodeのドキュメントnpmのドキュメントには記載がなくて、 何の仕様に基づくフィールドなのかよくわからない。

なにか特定のパッケージの拡張なのかなと思って調べてみるとこの記事が見つかった。 記事を読む感じだとpostcss関係の拡張のようだ。

https://jaketrent.com/post/package-json-style-attribute/

This plugin can consume local files, node modules or web_modules. To resolve path of an @import rule, it can look into root directory (by default process.cwd()), web_modules, node_modules or local modules. When importing a module, it will look for index.css or file referenced in package.json in the style or main fields. You can also provide manually multiples paths where to look at.

postcss-importというpostcssのプラグインのREADMEには、 cssの@importを解決するためにnode_modules内のパッケージのstyleプロパティを読みにいく旨が書かれている。

このフィールドを含むパッケージを公開しても利用者側のバンドラがちゃんと対応していなきゃ使えない気がするので、 あまり積極的に使いたい機能ではない気がする。 (やるならpackage.jsonのexportsフィールドでcssを指定するほうが、直感的にわかりやすいと思う)

その他

Viteはこのfieldが適切に読みこんでくれるのかよくわからない。 このIssueがCloseされていて、それっぽい修正が入っているが手元の環境だとうまく動いてくれなかった。 ちゃんと原因を切り分けて調査したわけではないので、なにか設定が漏れているだけかもしれない。

https://github.com/vitejs/vite/issues/1874 https://github.com/vitejs/vite/commit/f90a85c2ba8c9ba215fe75c49035a7e38fa81a7d