☰

Webpack style-loader と css-loader 質問する

tag-icon • tag-icon webpack webpack-style-loader
Webpack style-loader と css-loader 質問する

質問が2つあります。

1)CSS ローダーそしてスタイルローダー2 つの webpack ローダーがあります。この 2 つの違いがわかりません。どちらも同じ機能を果たすのに、なぜ 2 つのローダーを使用する必要があるのでしょうか。

2) 上記の Readme.md ファイルに記載されている .useable.less と .useable.css とは何ですか?

ベストアンサー1

CSS ローダーは CSS ファイルを受け取り、 webpack の機能を使用して解決されたimportsCSSを返します。url(...)require

var css = require("css!./file.css");
// => returns css code from file.css, resolves imports and url(...)

返された CSS に対しては実際には何も行われません。

スタイル ローダーは CSS を受け取り、それを実際にページに挿入して、そのスタイルがページ上でアクティブになるようにします。

これらは異なる操作を実行しますが、Unixのパイプのように連結すると便利なことがよくあります。たとえば、Less CSSプリプロセッサ、あなたは使うことができます

require("style!css!less!./file.less")

に

  1. file.lessLessローダーでプレーンCSSに変換する
  2. CSSローダーを使用してCSS内のすべてのimportsおよびを解決するurl(...)
  3. スタイルローダーを使用してページにスタイルを挿入します

おすすめ記事