以 react 为例,步骤如下:
-  
npm create vite@latest my-app -- --template react选择 React 和 JavaScript -  
根据上述命令的输出提示,运行以下命令
cd my-app
npm install
npm run dev
一个 React App 初始化完成。 -  
安装 Tailwindcss

 -  
@theme的使用(非必须,仅测试),App.css: 
@import "tailwindcss";
@theme {
  --color-twitter-blue: #1da1f2;
}
 
但是这里会出现 unknownAtRules 的警告,解决办法:

 就是在 .vscode 中自动打开的空白setting.json 中加上以上代码就行,可消除警告。
- 测试 Tailwind,App.jsx 代码如下, 
m用于设置 margin,p可用于设置 padding, 很多都与 bootstrap 相似。 
import React from "react";
import "./App.css"
const App = () => {
  return (
    <div>
      <section>
        <p className="bg-twitter-blue m-20 text-7xl">
          Lorem ipsum dolor sit amet consectetur adipisicing elit. Ipsa quod
          iste maxime cum tempore, deserunt ea esse molestiae eos temporibus
          molestias, alias officiis, blanditiis enim. Magnam magni enim pariatur
          cupiditate?
        </p>
      </section>
    </div>
  );
};
export default App;
 
运行结果:




















