Install Tailwind CSS with Meteor

Setting up Tailwind CSS in a Meteor project.

Start by creating a new Meteor project if you don't have one set up already. The most common approach is to use the Meteor CLI.

Terminal

npx meteor create my-projectcd my-project

Install @tailwindcss/postcss and its peer dependencies via npm.

Terminal

npm install tailwindcss @tailwindcss/postcss postcss postcss-load-config

Create a postcss.config.mjs file in the root of your project and add the @tailwindcss/postcss plugin to your PostCSS configuration.

postcss.config.mjs

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

Add an @import for Tailwind CSS to your ./client/main.css file.

main.css

@import "tailwindcss";

Run your build process with npm run start.

Terminal

npm run start

Start using Tailwind’s utility classes to style your content.

App.jsx

export const App = () => (  <h1 className="text-3xl font-bold underline">    Hello world!  </h1>)

Tailwind CSS 中文网（本网站）的目标是为中文开发者提供准确、及时的 Tailwind CSS 中文文档

Tailwind CSS 中文文档由本网站维护人员共同翻译，采用 MIT 开源协议发布

本网站与 tailwindcss.com 及 Tailwind Labs Inc. 并无从属关系

Tailwind 商标由 Tailwind Labs Inc. 所有