参考にするサイトを間違えたり、勘違いして無駄に時間を浪費してしまったので
備忘録として記録を残す。
基本は上記のサイトに記載してある順に行えば良いので、これ以降は見る必要はない。
Nuxt.jsのアップデートをする
$ npm update nuxt
Please make sure to update your Nuxt version to be minimum v2.15.3.
お使いのNuxtのバージョンをv2.15.3以上にアップデートしてください。
と書いてあるので、念の為アップデートしておく。
tailwindcssをインストール
npm install --save-dev @nuxtjs/tailwindcss
nuxt.config.jsに追記する
下記はcreate-nuxt-app
コマンドを実行した際に出てくる質問のなかで、tailwindcssを選んでいると、はじめから記載されている。
nuxt.config.js
export default {
buildModules: ['@nuxtjs/tailwindcss']
}
今回は、何を思ったのか上記をtailwind.config.jsに書くんだと勘違いしまってた。
この時点ではtailwind.config.jsはまだないので注意。
tailwind.config.jsを作成
$ npx tailwindcss init
このコマンドを叩くと、tailwindcss.config.jsファイルがルート上に作られる。
ここまでやれば、tailwindcssが有効になっているはずなので、確認する。