Buy NowGet Update

Integration Tailwind

Install Tailwind CSS
npm install -D tailwindcss postcss autoprefixer
Create files

Create files in the root directory

  • tailwind.config.js
  • postcss.config.js or postcss.config.cjs (vite.js)
const config = {
  content: ['./index.html', './src/**/*.{js,ts,jsx,tsx}'],
  theme: {
    extend: {},
  },
  corePlugins: {
    // Remove the Tailwind CSS preflight styles so it can use Material UI's preflight instead (CssBaseline).
    preflight: false,
  },
  plugins: [],
};
 
export default config;
tailwind.config.js

module.exports = {
  plugins: {
    tailwindcss: {},
    autoprefixer: {},
  },
}
postcss.config.js
Update file
  • src/global.css
  • .eslintignore
...
/* scrollbar */
@import 'simplebar-react/dist/simplebar.min.css';
 
@tailwind base;
@tailwind components;
@tailwind utilities;
src/global.css

...
src/setupTests.ts
postcss.config.js
postcss.config.cjs
tailwind.config.js
.eslintignore
Reference: