😺
【Next.js】基礎から始めるNext.js API Routes【9Tailwind Setup】
【9Tailwind Setup】
YouTube: https://youtu.be/edO0CxuFvOc
今回は「tailwind css」のセットアップを行います。
インストールコマンド
npm install -D tailwindcss postcss autoprefixer
tailwindの初期化
npx tailwindcss init -p
上記の初期化を行うと以下のファイルが作成されますので、
ドキュメントの内容をコピーして内容を差し替えます。
tailwind.config.js
/** @type {import('tailwindcss').Config} */
module.exports = {
content: [
'./pages/**/*.{js,ts,jsx,tsx}',
'./components/**/*.{js,ts,jsx,tsx}',
],
theme: {
extend: {},
},
plugins: [],
}
最後に「styles」フォルダ内の「global.css」の内容を以下の通りに差し替えます。
styles/globals.css
@tailwind base;
@tailwind components;
@tailwind utilities;
Discussion