install tailwind with npm

install tailwindcss nodejs

First add tailwind and postcss
npm install tailwindcss postcss autoprefixer postcss-cli

Initialize tailwindcss
npx tailwindcss init

Create a "postcss.config.js" and paste the following in it
module.exports = {
  plugins: [
    require('tailwindcss'),
    require('autoprefixer'),
  ]
}

Create the necessary files
mkdir public
mkdir public/styles
touch public/styles/tailwind.css
touch public/styles/style.css

Paste the following in public/styles/tailwind.css
@tailwind base;
@tailwind components;
@tailwind utilities;

The last thing is to add this to the scripts in package.json
"tailwind:css": "postcss public/styles/tailwind.css -o public/styles/style.css"

Posted by: Guest on March-27-2022

#if you need package.json file, run init command npm init -y #install tailwind npm i tailwindcss #if building forms also install npm install @tailwindcss/forms # in your src folder add "style.css" with lines below, to import tailwind styles: @tailwind base; @tailwind components; @tailwind utilities; #create a script in package.json "scripts" : { "build:css": "tailwind build src/style.css -o dist/style.css", "watch:css": "npx tailwindcss -i ./src/style.css -o ./dist/style.css --watch" } #run the build npm run build:css #run watch when working npm run watch:css

Code answers related to "install tailwind with npm"

Code answers related to "CSS"

CSS Answers by Framework

Browse Popular Code Answers by Language

Answers for "install tailwind with npm"

Code answers related to "install tailwind with npm"

Code answers related to "CSS"

CSS Answers by Framework

Browse Popular Code Answers by Language

Popular Programming Languages

Advertisements

Company

Compilers

Help

Connect with us