kyaidoのブックマーク / 2022年3月25日

kyaido id:kyaido

2022年3月25日のブックマーク (3件)

HTML の `hidden` 属性が列挙型に変更され `hidden="until-found"` が追加
すべての HTML 要素に指定できる hidden 属性はこれまで真偽属性でしたが、このたび列挙型に変更され、新たに until-found が定義されました。 hidden="": Hidden 状態 hidden="hidden": Hidden 状態 hidden="until-found": Until found 状態 ← New! 2022年3月24日現在、 Chrome 102 (canary) は hidden="until-found" に対応しており、本記事で例示する挙動を確認できます。これは以下の issue で提案されていたものです。 Proposal: beforematch event and hidden=until-found attribute · Issue #6040 · whatwg/html 例えばこんな HTML の場合。 <section
kyaido 2022/03/25
リンク
Next.js+TypeScript+CSS Modules+SCSS環境（2022.01）
Next.jsで使用しているのはdeprecatedなLibSassではなくDart Sassなので、@importではなく@useが使える。やったね！ディレクトリ構成はとりあえず以下のようにしている。 src/styles以下にグローバルなSCSSを配置アプリ全体で読み込むglobal.scss 色やサイズ等の変数（デザイントークン）定義各種mixin 各コンポーネントのSCSSは各コンポーネントのファイルと同じフォルダに配置グローバルなSCSSや定義のインポートをしやすくするため、tsconfig.jsonにエイリアスを定義
kyaido 2022/03/25
リンク
npm-scripts を書く時の手癖 - mizdra's blog
かれこれ 5 年くらい趣味開発で npm-scripts を書き続けている。長年書き続けているとノウハウが蓄積されてきて、「こう書くとスッキリする」「迷いがなくなる」「後から拡張したくなった時に、簡単に拡張できる」みたいな書き方が身についてきた。自分の型、あるいは手癖のようなものだと思う。せっかくなので、id:mizdra の今の npm-scripts を書く時の手癖を書き連ねてみる。基本形 { "scripts": { "build": "webpack --mode production", "dev": "webpack-dev-server --mode development", "lint": "eslint .", "test": "jest" } } 一番シンプルな npm-scripts を書く時のパターン。以下の 4 つの script を登録している。 buil
kyaido 2022/03/25
リンク
- 2022年3月26日
- 2022年3月25日
- 2022年3月24日