less cssファイルをそのままImportする
lessでcssファイルをそのままImportする方法を紹介します。
cssの@importではなく、lessのコンパイル時にcssを読み込みます。
下記のように(inline)を追加します。
@import (inline) "foo.css";lessで実装しているときに外部のcssを取り込みたい場合などに使用します。
- webpack lessをImportしてビルドする
Vue.js lessを使いwebpackでビルドするでvueファイルの中でlessを実装してビルドする方法を紹介しました。htmlやbodyなどに適用するベースのクラスを外部のlessファイルに実装...
- webpack モジュールのパスを絶対パスで指定する方法
自分で作成したモジュールをインポートするときはインポートするファイルを基準に相対パスで指定する必要があります。フォルダ構成によっては深く階層を辿らないといけないので、フォルダ構成が変わってしまうと大変...
- Vue.js lessで外部のlessファイルをImportする
Vue.js lessを使いwebpackでビルドするで.vueファイル（単一ファイルコンポーネント）のstyleをcssではなくlessで実装して、webpackでビルドをしました。メインカラーなど...
- Vue.js lessを使いwebpackでビルドする
.vueファイル（単一ファイルコンポーネント）のstyleをcssではなくlessで実装して、webpackでビルドをします。sassでも以下記事のlessの文言がsassに置き換わるくらいでやり方は...
- less font-sizeをremで汎用的に使いこなす
emや%のようにサイズを相対的に指定すると、親要素の影響を受けてしまうのでサイズの計算が難しくなってしまいます。css3ではrem（root em）という単位でルートの要素（html）のサイズに対して...
- cssのcalcの設定をlessで記述するときの注意点
cssで計算式を行うためのcalcをlessで同じように実装するには少し工夫が必要です。以下のように普通にcalcを指定すると、lessをコンパイルしたタイミングで計算が行われてしまいます。以下のよう...
- gulp lessをcssにコンパイルする
lessファイルをgulpを使ってcssにコンパイルします。gulp-lessとgulp-autoprefixerをインストールします。gulp-autoprefixerはなくても構いませんが、古いブ...
- wsl2にインストールしたDockerを自動起動する
wsl2のUbuntu環境にインストールしたDockerを自動起動する方法を紹介します。Docker Desktopではなく、Ubuntuの環境にDockerをインストールした場合についての記事になり...
- wsl2にインストールしたDockerのコンテナ内でネットワークエラーが発生する場合の対処法
wsl2のUbuntuにインストールしたDockerのコンテナ内で、ネットワークエラーが発生したことがありましたので、対処法を紹介します。以下のベースイメージをビルドしたものを起動して。.NET6のA...
- WSL2(Ubuntu)の環境にあるファイルをVSCodeで開く
WSL2(Ubuntu)の環境にあるファイルをVSCodeで開く方法紹介します。事前準備として、WSL2(Ubuntu)の環境に作業フォルダを作成しておきます。Windowsからはwsl$のパスが、W...