主页 / user-4896472

TheChubbyPanda's questions

Martin Hope
TheChubbyPanda
Asked: 2024-12-01 21:09:58 +0800 CST
  • 5

因此，我设法让 Tailwind v4 alpha 开始运行。它使用该postcss.config.js文件：

export default {
  plugins: {
    '@tailwindcss/postcss': {},
  }
};

不过，我读到我应该能够在我的文件中做这样的事情vite.config.js（并删除postcss.config.js文件）：

@@ -1,5 +1,6 @@
 import { defineConfig } from "vite";
 import { sveltekit } from "@sveltejs/kit/vite";
+import tailwind from "tailwindcss";
 
 // @ts-expect-error process is a nodejs global
 const host = process.env.TAURI_DEV_HOST;
@@ -29,4 +30,9 @@ export default defineConfig(async () => ({
       ignored: ["**/src-tauri/**"],
     },
   },
+  css: {
+    postcss: {
+      plugins: [tailwind],
+    },
+  },
 }));

不幸的是，以下错误出现了：

[plugin:vite:css] [postcss] 您似乎正尝试tailwindcss直接将其用作 PostCSS 插件。PostCSS 插件已移至单独的包，因此要继续将 Tailwind CSS 与 PostCSS 结合使用，您需要安装@tailwindcss/postcss并更新 PostCSS 配置。

更不幸的是，我的package.json已经包含@tailwindcss/postcss作为开发依赖项：

"devDependencies": {
    "@sveltejs/adapter-static": "^3.0.5",
    "@sveltejs/kit": "^2.7.0",
    "@sveltejs/vite-plugin-svelte": "^4.0.0",
    "@tailwindcss/postcss": "4.0.0-beta.4",
    "@tauri-apps/cli": "^2",
    "svelte": "^5.0.0",
    "svelte-check": "^4.0.0",
    "tailwindcss": "4.0.0-beta.4",
    "tslib": "^2.8.0",
    "typescript": "^5.5.0",
    "vite": "^5.4.10"
  }

为什么仍然会出现这个错误？

tailwind-css