Skip to content

Commit 8d716f6

Browse files
committed
Remove webpacker support
The heart of this engine is a sprockets-specific approach to using TW with the asset pipeline. By removing the webpacker support we can focus our efforts in building a better TW asset pipeline approach. Currently, if you need advanced TW configuration you will need to go through the webpack(or other js bundlers).
1 parent 5e3387f commit 8d716f6

File tree

5 files changed

+6
-52
lines changed

5 files changed

+6
-52
lines changed

README.md

+4-6
Original file line numberDiff line numberDiff line change
@@ -2,26 +2,24 @@
22

33
[Tailwind CSS](https://tailwindcss.com) is a utility-first CSS framework packed with classes like flex, pt-4, text-center and rotate-90 that can be composed to build any design, directly in your markup.
44

5-
Tailwind CSS for Rails works with both the asset pipeline and Webpacker.
5+
This gem just gives access to the standard Tailwind CSS framework. If you need to customize Tailwind, you will need to install it the traditional way using [Webpacker](https://github.com/rails/webpacker) instead. This gem is purely intended for those who wish to use Tailwind CSS with the asset pipeline.
66

7-
When used with the asset pipeline, production-mode purging of unused css class names is provided by a Sprockets compressor built into this gem. This compressor ensures that only the css classes used by files in `app/views` and `app/helpers` are included. In development mode, the full 3mb+ Tailwind stylesheet is loaded. In both cases, Tailwind CSS is configured for dark mode, forms, aspect-ratio, typography, and the Inter font. If you need more configuration than that, you'll need to use it with Webpacker.
7+
Production-mode purging of unused css class names is provided by a Sprockets compressor built into this gem. This compressor ensures that only the css classes used by files in `app/views` and `app/helpers` are included. In development mode, the full 3mb+ Tailwind stylesheet is loaded.
88

9-
When used with Webpacker, Tailwind CSS is installed as a postCSS processor. Refer to the [TailwindCSS documentation](https://tailwindcss.com/docs/installation#customizing-your-configuration) to customize your tailwind.config.js file.
9+
In both cases, Tailwind CSS is configured for dark mode, forms, aspect-ratio, typography, and the Inter font. If you need more configuration than that, you'll need to use it with Webpacker.
1010

1111

1212
## Installation
1313

1414
1. Run `./bin/bundle add tailwindcss-rails`
1515
2. Run `./bin/rails tailwindcss:install` (on a fresh Rails application)
1616

17-
When run on an app using just the asset pipeline, the last step adds the purger compressor to `config/environments/production.rb`. This ensures that when `assets:precompile` is called during deployment that the unused class names are not included in the tailwind output css used by the app. It also adds a `stylesheet_link_tag "tailwind"` and `stylesheet_link_tag "inter-font"` to your `app/views/application.html.erb` file.
17+
When run on an app using just the asset pipeline, the last step adds the purger compressor to `config/environments/production.rb`. This ensures that when `assets:precompile` is called during deployment that the unused class names are not included in the tailwind output css used by the app. It also adds a `stylesheet_link_tag "tailwind"` and `stylesheet_link_tag "inter-font"` to your `app/views/layouts/application.html.erb` file.
1818

1919
You can do these things yourself, if you've changed the default setup.
2020

2121
Note: You should ensure to delete `app/assets/stylesheets/scaffolds.scss` that Rails adds after running a scaffold command, if you had run this generator before installing Tailwind CSS for Rails. This stylesheet will interfere with Tailwind's reset of base styles. This gem will turn off stylesheet generation for all future scaffold runs.
2222

23-
When run on an app using Webpacker, the last step adds the npm dependencies for Tailwind CSS, configures postCSS, and generates a app/javascript/stylesheets/application.scss file as the default for using Tailwind.
24-
2523

2624
## Purging in production
2725

lib/install/stylesheets/application.scss

-3
This file was deleted.

lib/install/tailwindcss_with_webpacker.rb

-22
This file was deleted.

lib/tasks/tailwindcss_tasks.rake

+2-21
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,7 @@
11
namespace :tailwindcss do
22
desc "Install Tailwind CSS into the app"
33
task :install do
4-
if defined?(Webpacker::Engine)
5-
Rake::Task["tailwindcss:install:webpacker"].invoke
6-
else
7-
Rake::Task["tailwindcss:install:asset_pipeline"].invoke
8-
end
9-
end
10-
11-
namespace :install do
12-
desc "Install Tailwind CSS with the asset pipeline"
13-
task :asset_pipeline do
14-
run_install_template "tailwindcss_with_asset_pipeline"
15-
end
16-
17-
desc "Install Tailwind CSS with webpacker"
18-
task :webpacker do
19-
run_install_template "tailwindcss_with_webpacker"
20-
end
4+
system "#{RbConfig.ruby} ./bin/rails app:template LOCATION=#{File.expand_path("../install/tailwindcss.rb", __dir__)}"
215
end
226

237
desc "Show the list of class names being kept in Tailwind CSS"
@@ -31,14 +15,11 @@ namespace :tailwindcss do
3115
end
3216
end
3317

34-
def run_install_template(path)
35-
system "#{RbConfig.ruby} ./bin/rails app:template LOCATION=#{File.expand_path("../install/#{path}.rb", __dir__)}"
36-
end
37-
3818
def default_files_with_class_names
3919
Rails.root.glob("app/views/**/*.*") + Rails.root.glob("app/helpers/**/*.rb")
4020
end
4121

4222
def tailwind_css
4323
Pathname.new(__FILE__).join("../../../app/assets/stylesheets/tailwind.css").read
4424
end
25+

0 commit comments

Comments
 (0)