本文发表于 188 天前,其中的信息可能已经事过境迁
文章摘要 FakeGPT
加载中...|
添加依赖
sh
pnpm add tailwindcss tailwindcss postcss autoprefixer -D
生成taiwindcss.config.js文件
sh
npx tailwindcss init / 或 pnpm dlx tailwindcss init
修改taindcss.config.js文件
js
// tailwind.config.js
/** @type {import('tailwindcss').Config} */
export default {
content: [
//覆盖路径,看是否有配置srcDir 源文件目录,来编写路径。
"./docs/src/**/*.js",
"./docs/src/**/*.ts",
"./docs/src/**/*.vue",
"./docs/src/**/*.md",
],
options: {
safelist: ["html", "body"],
},
};
将 Tailwind 指令添加到您的 CSS 中
- 新建一个style.css文件
css
/* docs/.vitepress/theme/style.css */
@tailwind base;
@tailwind components;
@tailwind utilities;
- 导入到index.ts中
ts
/* docs/.vitepress/theme/index.ts */
import DefaultTheme from "vitepress/theme";
import "./style.css"; //导入
export default DefaultTheme;
VitePress集成tailwindcsshttps://yexu-vitepress.vercel.app/posts/2025/02101124
赞赏博主