80990


以前からTailwind cssを使っていましたが、今回v2.2をインストールしてJITで逐次コンパイルを試みています。

`tailwind.config.js`にJIT設定(mode: 'jit')をして`npm run
watch`で確かにapp.cssの容量が大幅に小さくなり動作は確認しました。  
が、vscodeで例えば`text-gray-500`から`text-red-500`に変更しても逐次コンパイルされません。  
`tailwind.config.js`をいじるか`npm run watch`を起動し直せばコンパイルされます。

ソースを変更したらリアルタイムでコンパイルされる様子をtwitterなどでいくつも見ているので、おそらく何かが足りないと思うのですが、どのようにしたらよいでしょうか。

追記  
phpのlaravelを使っています。


CC BY-SA 4.0
2021-08-23T03:19:39.453
80977
2021-08-23T12:59:28.673
2021-08-23T07:25:32.550
34267
34267
question
laravel tailwindcss
Tailwind cssでJITによる逐次コンパイルの方法


`npm run watch` がどのようなコマンドを実際に実行しているかご質問に記載がないので、不明ですが、よくやるありそうなミスとしては

[【Tailwind CSS #5】開発が超ラクになるTailwindのJITモードを紹介！！ -
YouTube](https://www.youtube.com/watch?v=TfR_0zbjKOM&t=180s)

この動画の３分から５分あたりの解説にある通り、

`TAILWIND_MODE=watch` と `-w`

の付け忘れだと思います。

公式ドキュメントだと  
<https://tailwindcss.com/docs/just-in-time-mode#styles-don-t-update-when-
saving-content-files>  
が該当箇所です。

`package.json`の該当箇所を確認してみてください。


CC BY-SA 4.0
2021-08-23T10:17:18.130
80990
2021-08-23T12:59:28.673
2021-08-23T12:59:28.673
9008
9008
80977
answer