Tailwind (with Config & TailwindUI & PurgeCSS)
A utility-first CSS framework for rapid UI development. (based off Mark Mead's template based off Benjamin Darcet's template)
Used 267 times
r
rodreegez
Usage
Run this command in your Rails app directory in the terminal:
rails app:template LOCATION="https://railsbytes.com/script/zJosN1"Template Source
Review the code before running this template on your machine.
run "yarn add tailwindcss @tailwindcss/ui"
run "yarn tailwind init"
run "mkdir app/javascript/css"
run "touch app/javascript/css/application.scss"
inject_into_file "app/javascript/css/application.scss" do <<~EOF
@import 'tailwindcss/base';
@import 'tailwindcss/components';
@import 'tailwindcss/utilities';
EOF
end
run "npx tailwindcss init"
inject_into_file "app/javascript/packs/application.js" do <<~EOF
require('css/application.scss')
EOF
end
inject_into_file "postcss.config.js", before: "require('postcss-import')" do <<~EOF
require('tailwindcss'),
EOF
end
inject_into_file "app/views/layouts/application.html.erb", before: "</head>" do <<~EOF
<%= stylesheet_pack_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
EOF
end
gsub_file "tailwind.config.js", /plugins:\s\[],/, "plugins: [require('@tailwindcss/ui')],"
gsub_file "tailwind.config.js", /purge:\s\[],/, <<-PURGE
purge: [
'./app/**/*.html.erb',
'./app/helpers/**/*.rb',
'./src/**/*.html',
'./src/**/*.vue',
'./src/**/*.jsx',
],
PURGE