Comments (4)
jontebol
commented on July 16, 2024
1
Thx @wittawasw. Since I opened this issue I've gotten much better at installing and configuring Tailwind both with and without webpacker, so for my own sake everything is fine (though I have reverted to not using the gem). I only opened the issue in case there was something missing in the installer. Feel free to close it if it's not of any value.
from tailwindcss-rails.
dhh
commented on July 16, 2024
1
We've dropped webpack support from this gem. It's now exclusively intended for use with sprockets. Will introduce another, easy way to add TW to a webpack setup. But doesn't make sense to share it in the same gem.
from tailwindcss-rails.
jontebol
commented on July 16, 2024
Here's the output from the install command:
$ ./bin/rails tailwindcss:install
warning: parser/current is loading parser/ruby26, which recognizes
warning: 2.6.6-compliant syntax, but you are running 2.6.3.
warning: please see https://github.com/whitequark/parser#compatibility-with-ruby-mri.
warning: parser/current is loading parser/ruby26, which recognizes
warning: 2.6.6-compliant syntax, but you are running 2.6.3.
warning: please see https://github.com/whitequark/parser#compatibility-with-ruby-mri.
Installing Tailwind CSS
run yarn add tailwindcss@npm:@tailwindcss/postcss7-compat postcss@^7 autoprefixer@^9 from "."
yarn add v1.22.10
[1/4] 🔍 Resolving packages...
[2/4] 🚚 Fetching packages...
error [email protected]: The engine "node" is incompatible with this module. Expected version ">=12.13.0". Got "10.23.0"
error Found incompatible module.
info Visit https://yarnpkg.com/en/docs/cli/add for documentation about this command.
append app/javascript/packs/application.js
Configuring Tailwind CSS
create app/javascript/stylesheets
create app/javascript/stylesheets/application.scss
run npx tailwindcss init from "."
npx: installed 80 in 5.199s
Cannot find module 'autoprefixer'
insert postcss.config.js
Default application.html.erb is missing!
Add <%= stylesheet_pack_tag "application", "data-turbo-track": "reload" %> within the <head> tag in your custom layout.
I did the last step manually of course. As I understand it run npx tailwindcss init from "." should have created the tailwind.config.js file but didn't.
from tailwindcss-rails.
wittawasw
commented on July 16, 2024
@jontebol There are number of issues with installing tailwindcss itself even without this gem.
Try yarn add tailwindcss@latest postcss@latest autoprefixer@latest and see if there are other errors from it.
Edited: for anyone who stumble upon this issue. It's highly recommended to update nodejs to latest stable before installing since tailswindcss is a very recent development and tend to break in older nodejs or npm versions.
from tailwindcss-rails.
Related Issues (20)
- Need to add `config.assets.debug = true` to `development.rb` file HOT 10
- fix tailwindcss-rails support on Windows HOT 1
- optional flag to use commonjs configuration when installing
- tailwindcss-rails-2.0.29-x86_64-linux/exe/x86_64-linux/tailwindcss: Syntax error: word unexpected (expecting ")") HOT 3
- Tailwind 3.3.2 crashing on Rails 7 HOT 5
- Error: Cannot find module 'tailwindcss/defaultTheme' when deploying to production server HOT 1
- Including custom CSS files from node_modules and CSS from gems HOT 1
- Tailwind breaks rails mailer generator for namespaced files HOT 2
- Upgrading tailwindcss-rails from 2.0.29 to 2.0.30 broke web-console HOT 14
- rails tailwindcss:build ELF not found error HOT 4
- caniuse-lite is outdated and cannot update without package.json HOT 1
- bg-[url(...)] not working with rails_blob_url (active_storage)
- v2.0.31 Fails on ruby 2.7.x HOT 6
- Browserslist: caniuse-lite is outdated. HOT 1
- RUBY_DEBUG_OPEN=true in Procfile.dev breaks running Rails app within Docker container HOT 4
- Colours not being applied as they should in Rails 7.0.8 and Ruby 3.2.2 HOT 1
- Browserslist: caniuse-lite is outdated. Please run: 21:49:24 css.1 | npx update-browserslist-db@latest HOT 1
- Remove Inter font assets from inclusion in downstream projects HOT 6
- Support @config directive and multiple *.tailwind.css files HOT 1
- use scaffold generate password class is nil HOT 2
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from tailwindcss-rails.