css

webpackでnode_modules配下のcssをimportするときのpathにチルダを入れる

npm installやyarn installで追加したcssを@importするとき、../../node_modules/normalize.css/normalize.cssのようにnode_modulesまでのディレクトリを辿っていくのは面倒。 stackoverflow.com So using the prefix ~ at the start of the path tells the …

css-hot-loaderでcssファイルのhot module replacement

github.com extract-text-webpack-pluginでcssを別のファイルに出力するようにしていると、hot module replacementが使えない。 process.env.node_env !== 'production'でdevelopmentとproductionでextract-text-webpack-pluginを使い分けて、開発環境ではho…

webpackでのcssファイルの設定

webpackでCSSをインラインのstyleではなく、CSSファイルとして出力する場合の設定。 extract-text-webpack-pluginを使ってCSSを別ファイルに出力する。 extract-text-webpack-plugin Extract text from a bundle, or bundles, into a separate file. バンド…

caret-color

css

caret-colorでキャレットの色をCSSから指定できるようになる。キャレットは、入力フィールドで挿入箇所を示すインジケータのこと。 developer.mozilla.org 今のところChrome, Firefox, Operaなどでサポートされてる。 Can I use... Support tables for HTML5…

scroll-behavior

css

developer.mozilla.org ナビゲーションによるスクロールとか、ユーザ操作ではないスクロールにおけるスクロールの振る舞いを決めるCSSプロパティ。 サポート状況 Can I use... Support tables for HTML5, CSS3, etc 今はfirefoxのみ。 .scroll-behavior { sc…