代码之家 › 专栏 › 技术社区 › Reagan

使用tailwind CLI在我的PHP项目中添加tailwind不会在frotand中显示样式。output.css为空或图标正确

tailwind-css css php

Reagan · 技术社区 · 5 月前

我正在构建我的第一个PHP项目,我想使用tailwindcss进行样式设置。

我正在使用顺风CLI,所以我是这样做的。

我从下载了最新版本 here .我用 tailwindcss-windows-x64.exe .
将文件复制到我的项目并重命名为 tailwindcss.exe
添加 input.css 公用文件夹中的文件。 public_html/assets/css/input.css

这是内容 input.css 文件。

@tailwind base;
@tailwind components;
@tailwind utilities;

我还添加了另一个名为 tailwind.config.js

module.exports = {
  content: ['./src/view/**/*.php'], // Scans all PHP files in src/view folder and subdirectories
  theme: {
    extend: {},
  },
  plugins: [],
};

然后运行命令

tailwindcss.exe -i public_html/assets/css/input.css -o public_html/assets/css/output.css --w

该命令将生成 output.css 文件旁边 input.css 文件。

检查时 output.css ,我只看到此内容

/*! tailwindcss v4.0.0 | MIT License | https://tailwindcss.com */
@tailwind base;
@tailwind components;

我尝试添加 output.css 文件到我的视图文件 src/view/index.view.php

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <link rel="stylesheet" type="text/css" href="/assets/css/output.css" />
</head>

<body>
  <div class="p-4 bg-green-300">Test</div>
</body>

</html>

我在VScode中看到了建议的类,但我没有看到页面中应用的CSS样式。

这是我的文件结构