jawsdev/Basic-Tailwind-Parcel-Starter

Build

npx parcel src/index.html

To re-create this type of build:

https://tailwindcss.com/docs/guides/parcel

Create your project

Terminal

mkdir my-project
cd my-project
npm install -D parcel
mkdir src
touch src/index.html

Install Tailwind CSS

Terminal

npm install -D tailwindcss postcss autoprefixer
npx tailwindcss init -p

Configure your template paths

tailwind.config.js

  content: [
    "./src/**/*.{html,js,ts,jsx,tsx}",
  ],

Add the Tailwind directives to your CSS

style.css

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

Start your build process

Terminal

npx parcel src/index.html

Start using Tailwind in your project

index.html

<!doctype html>
<html>
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link href="./index.css" rel="stylesheet">
</head>
<body>
  <h1 class="text-3xl font-bold underline">
    Hello world!
  </h1>
</body>
</html>

jawsdev / Basic-Tailwind-Parcel-Starter

Build

Create your project

Terminal

Install Tailwind CSS

Terminal

Configure your template paths

tailwind.config.js

Add the Tailwind directives to your CSS

style.css

Start your build process

Terminal

Start using Tailwind in your project

index.html

About

Languages