webpack@4 でCSSを抽出する際は mini-css-extract-plugin を使う - 30歳からのプログラミング
この記事を読んでいて知ったのだが、CSSを抽出する目的でextract-text-webpack-pluginを使うのは非推奨になったらしい。 qiita.com github.com webpack@4では mini-css-extract-plugin というプラグインを使うことが推奨されている。 というわけで、その使い方を書いていく。 webpack でのCSSの扱いの基礎については、以前書いたこの記事を参照。 numb86-tech.hatenablog.com 本記事は以下のバージョンで動作確認している。 webpack@4.20.2 webpack-cli@3.1.2 css-loader@1.0.0 mini-css-extract-plugin@0.4.4 optimize-css-assets-webpack-plugin@5.0.1 terser-webpack-plu
デザイナーにもオススメ！シンプルですぐできるSass（SCSS）開発環境構築 | Black Everyday Company
ファミコン風CSSフレームワーク（NES.css）を開発するために、Sassの開発環境を整えたので共有したい。 ウェブページをスタイリングするためにはCSSを使うのだが、崩壊しやすい性質を持っている。詳細度による優先付け、スタイルの上書きなど要因はさまざま。そんな脆いCSSをちょっとでもメンテしやすくするために「Sass」というCSSを拡張したメタ言語が使われる。簡単に階層構造を作れたり、ループや関数などプログラムっぽいものが書けたりと、大きなウェブページをつくるなら必須だ。 しかし、Sassを使う上で避けては通れないものがある。 SassからCSSに変換する「コンパイル」だ。 フロントエンドエンジニアならNode.jsやwebpackを使ってできてしまうだろうが、デザイナーが手を出したら「Node.jsこわい」「webpackこわい」となりかねない。以降、コマンドラインから扱う便利ツール
リセットCSSフレームワークのメモ - Qiita
リセットCSSとは各ブラウザが各々の歴史上の事情などで持っている、扱いづらい癖や、非互換性を解消するべく最初に読み込むCSSの決まり文句みたいなもの。 コピペで使うこともい多いが、bowerなどで呼び出して管理した方が最新版に更新するときなど便利な気がする。 ちょっと調べたので、幾つかのライブラリの癖などをメモ。 meyerweb.com - CSS Tools: Reset CSS 元祖。v2.0でhtml5にも対応。 原理主義的にリセットする。 ユニバーサルセレクタを利用していない。昨今のブラウザでは利用しても構わないと思うし、新しいタグとかできたら動作が不安。 Normalize.css Normalize.css: Make browsers render all elements more consistently. reset.cssにインスパイアされて作成された。 有用なデフ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
