當然指令不是背的，所以第一步就是要打開Tailwind CSS的官網。
主要的方式有CLI跟CDN，這裡使用的方式前者。- Install Tailwind CSS
npm install -D tailwindcss
npx tailwindcss init
- Configure your template paths 確認路徑
// tailwind.config.js
module.exports = {
content: ["./src/**/*.{html,js}"],
theme: {
extend: {},
},
plugins: [],
}
- Add the Tailwind directives to your CSS
新增一個主要放置CSS的檔案。這邊是
@tailwind base;
@tailwind components;
@tailwind utilities;
- Start the Tailwind CLI build process 啟動指令
npx tailwindcss -i ./src/input.css -o ./dist/output.css --watch
// 前面的路徑是第三步驟的檔案，後面路徑是輸出為至(再啟動指令後會被闖造出來的檔案)
- Start using Tailwind in your HTML 將第四部CSS引入HTML
