If you use rails ver.6 or higher, I wanted to read CSS with webpacker instead of ʻasset pipeline`, so I implemented it, so it's a memo.
From README.md of webpacker.
app/javascript:
└── packs:
# only webpack entry files here
└── application.js
└── application.css
It is assumed that rails new is completed.
If you are using a version lower than rails6, install webpacker as well.
Follow the directory structure of ↑. Create ʻapplication.css` file in app / javascript / packs
The entry point is packs / application.js, so import the application.css file.
packs/application.js
import "packs/application.css";
Describe the following in views / layouts / application.html.erb.
Probably the default is stylesheets_link_tag, so I wondered if I should change it to stylesheets_pack_tag.
<%= javascript_pack_tag 'application' %>
<%= stylesheet_pack_tag 'application' %>
All you have to do is write CSS. Next, I would like to introduce React and Vue.js.
This time, I just wrote down the procedure, so if you want to know the contents in a little more detail, ↓ will be helpful.
Rails 6+ Webpacker development environment was set up by a JS strong man (translation) I want to see css and images with webpacker Separate styles for each page with webpacker
Recommended Posts