Joshua Galit
Joshua Galit

Reputation: 1456

@tailwindcss/jit not working when configured in postcss.config.js

This is my dependencies and I already installed @tailwindcss/jit

image

I Followed the Instruction given by the

https://www.npmjs.com/package/@tailwindcss/jit

But when I try to replace the tailwindcss object

 // postcss.config.js
  module.exports = {
    plugins: {
      tailwindcss: {},
      autoprefixer: {},
    }
  }

Inside the postcss.config.js INTO THIS @tailwindcss/jit object

  // postcss.config.js
  module.exports = {
    plugins: {
      '@tailwindcss/jit': {},
      autoprefixer: {},
    }
  }

and when I try again to run using yarn dev

It got me this error

error - ./src/styles/tailwind.css ((webpack)/css-loader/cjs.js??ref--5-oneOf-6-1!(webpack)/postcss-loader/cjs.js??ref--5-oneOf-6-2!./src/styles/tailwind.css)
Error: ENOENT: no such file or directory, stat '/media/acatzk/Hard%20Drive/backup/React-Projects/joshuagalit.com/src/styles/tailwind.css'

DOES IT EFFECT WHEN YOU TRY TO ADD jsconfig.json? because i have this code and file structure

tempo

PLEASE HELP ME I NEED THIS KIND OF FILE STRUCTURE

P.S: I AM USING NEXT.JS

Upvotes: 1

Views: 7456

Answers (1)

Nathan Dawson
Nathan Dawson

Reputation: 19308

This is a known bug in the version of Tailwind JIT you have installed (0.1.3). It's failing to compile because of the spaces in the file path.

https://github.com/tailwindlabs/tailwindcss-jit/issues/22

A fix has already been released. All you need to do is update the dependency and it should be build as expected.

Upvotes: 3

Related Questions