首先,打开终端并进入项目文件夹。运行以下命令,以确保您安装了必要的依赖关系:
npm install react-scripts --save-dev
npm install tailwindcss postcss-cli autoprefixer --save-dev
创建一个新的配置文件 postcss.config.js,添加以下代码:
module.exports = {
plugins: [
require('tailwindcss'),
require('autoprefixer'),
],
};
在 src/index.css 中添加以下代码以启用 Tailwind 样式表:
@tailwind base;
@tailwind components;
@tailwind utilities;
当引入 Tailwind 后,如果样式表中包含任何错误,将不会编译。调试和排除错误可以参考 Tailwind CSS 错误文档。
完成上述步骤后,您现有的 React 应用程序应该能够使用 Tailwind CSS。