search

tailwindlabs / discuss

A place to ask questions, get help, or share what you've built with Tailwind CSS.
MIT License
171 stars 9 forks source link

unable to complete installation due to unresponsive npx commands to create necessary files. #464

Closed springpong closed 4 years ago

springpong commented 4 years ago

I'm unable to complete the installation due to the below commands not working.

Commands:

  1. $ npx tailwind init --full
  2. $ npx tailwindcss help build
  3. $ npm run build // this was ran after updating the package.json file by removing "start": to "build" as shown in installation process.
  4. $npx tailwind init // Since this command don't work, I created the tailwind.config.js file manually Result: Unexpected token

The build along with tailwind.css within the same folder was unable to create.

My setups: Computer: Mac IOS 10.15.3 node -v: 8.0.0 npm -v: 6.13.7 project type: React

Is there another way of installing?

Also, ran into lots of errors running $ npm install postcss-import, please see attached postcss install error

I'm super excited in trying out your amazing creation and would appreciate your help in getting it to work.

stevecochrane commented 4 years ago

I think gyp: No Xcode or CLT version detected! indicates that you might need to reinstall or update Xcode / Xcode Command Line Tools. Here's an issue from another project with some possible solutions: https://github.com/schnerd/d3-scale-cluster/issues/7

I'm pretty sure I had to update or reinstall my Xcode Command Line Tools when I upgraded to Catalina, and the above error text looks very familiar. I hope this helps.

springpong commented 4 years ago

Hi Steve,

Thank you for this tip. You're absolutely right, I upgraded Xcode and also the node v8.9.0. Able to run npx tailwind init.

But now I'm stuck with " npm run build". I had edited the package.json file accordingly, but unable to create build/tailwind.css. Here's what it looks like: npm run build error

Thank you so much for helping.

stevecochrane commented 4 years ago

Great! I'm glad that helped. As for this part, hmmm... it looks like it should work, though it's failing to find the css/tailwind.css input file. I would double-check the name and location of css/tailwind.css (its location should be relative to the package.json file). Hopefully that's a quick fix.

springpong commented 4 years ago

I really want to get Tailwind to work, but still struggling with running $ npm run build to generate the build directory with tailwind.css file. I had watched the installation video a few times and had breakthroughs where I got stuck with the previous steps in the installation process.

I'll be grateful for any more tips to overcome this. Or should I give up and use the CDN link ?

I also noticed the tailwind.css file with the @tailwind for base; components; utilities has an error of "unknownAtRule" Untitled 2

I really appreciate your response.

stevecochrane commented 4 years ago

Aha, now that I can see the file structure in your latest screenshot, I think it's throwing an error because css/ is within public/.

If you try this, hopefully it'll work: postcss public/css/tailwind.css -o public/build/tailwind.css

As for "unknownAtRule", I think that might just be a warning and it probably won't affect you. It might be validation from VS Code, or if you're using Stylelint, I think it warns about those, and you can suppress the warning through your Stylelint config.

springpong commented 4 years ago

@stevecochrane , I so appreciate your help.Thank you for teaching about getting the path right according to the order of files within the directory.

I also noticed the error messages stating needing node 8.7.0 or above. The build worked after installing that particular version. Now, I'm all setup to use Tailwind. Super excited.