Visual Studio で Tailwind CSS を使う
技術情報
公開: 2024年10月30日
Tailwind CSSのインストール
プロジェクトフォルダに移動後、以下のコマンドを実行
npm install -D tailwindcss
Tailwind CSSの設定ファイルを作成
npx tailwindcss init
設定ファイルを修正
content で対象となるファイル(html など)を指定
// tailwind.config.js
/** @type {import('tailwindcss').Config} */
export default {
content: ["./src/**/*.{html,ts,tsx}"],
theme: {
extend: {},
},
plugins: [],
}
cssファイルを作成
--watch オプションを付けると自動生成モードになる(コマンドプロンプトが終了しない)
npx tailwindcss -i ./src/input.css -o ./src/styles/tailwind.css --watch