本文发表于 188 天前,其中的信息可能已经事过境迁
文章摘要
加载中...|
此内容根据文章生成,并经过人工审核,仅用于文章内容的解释与总结 投诉

添加依赖

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 中

  1. 新建一个style.css文件
css
/* docs/.vitepress/theme/style.css  */
@tailwind base;
@tailwind components;
@tailwind utilities;
  1. 导入到index.ts中
ts
/*  docs/.vitepress/theme/index.ts  */
import DefaultTheme from "vitepress/theme";
import "./style.css"; //导入

export default DefaultTheme;
赞赏博主