rails: Rails 7, Ruby 3.1, Bootstrap The asset "application.css" is not present in the asset pipeline

I generate new rails app from github.com/rails/rails/ with this guide https://gist.github.com/vmcilwain/b44100e32165c82793d4df8691cee4e4

bundle exec rails new . -d postgresql -T --edge --css bootstrap

There are some errors with net/smtp. But I add gem 'net-smtp' and run tasks manually

There are some errors on rails css:install:bootstrap

I generated action: bin/rails g controller home index and got error:

Sprockets::Rails::Helper::AssetNotFound in Home#index The asset “application.css” is not present in the asset pipeline.

I change to application.bootstrap <%= stylesheet_link_tag "application.bootstrap", "data-turbo-track": "reload" %>

Got error: cannot load such file -- sassc

Uncomment gem "sassc-rails", "~> 2.1" in Gemfile

Got error SassC::SyntaxError in Home#index

Error: File to import not found or unreadable: bootstrap/scss/bootstrap.
        on line 1:1 of app/assets/stylesheets/application.bootstrap.scss
>> @import 'bootstrap/scss/bootstrap';

Decided to report a issue and return to it after some time.

Rails version: 7.0.0.alpha2 Ruby version: ruby 3.1.0preview1 (2021-11-09 master 5a3b2e6141) [x86_64-linux]

About this issue

Original URL
State: closed
Created 3 years ago
Reactions: 17
Comments: 16 (3 by maintainers)

Most upvoted comments

If anyone else ends up here trying to track down this issue for bootstrap, tailwind, or esbuild, there’s two things to note.

1. When Rails is set up, if your npm is too old (npm -v < 7.1), rails will not add the two scripts to your package.json, and will output an easy-to-miss message, which is also has a bug and does not output the correct message. The instructions tell you to

Add “scripts”: { “build:css”: “tailwindcss -i ./app/assets/stylesheets/application.tailwind.css -o ./app/assets/builds/application.css” } to your package.json

but if you’ve set up both tailwind and esbuild with -j esbuild -c tailwind, this message is incomplete. You need to add two scripts to your package.json:

"scripts": {
  "build": "esbuild app/javascript/*.* --bundle --sourcemap --outdir=app/assets/builds",
  "build:css": "tailwindcss -i ./app/assets/stylesheets/application.tailwind.css -o ./app/assets/builds/application.css"
}

2. This message also doesn’t tell you that you need to run yarn build:css afterwards in order for things to work, so you need to do that at least once. However, there is a generated Procfile.dev so either run those commands individually, or always run Rails in development using foreman start -f Procfile.dev instead of rails s. Then you don’t need to run the yarn build:css on its own.

It would be helpful if this was output in a message after creating a new project.

+14

bbugh on Jan 30, 2022

yarn build:css --watch says error Command "build:css" not found.

Used commands from here: https://github.com/rails/cssbundling-rails/blob/3f359b0900712654fe4139eddbfcd8cc1559a479/lib/install/sass/install.rb

yarn add sass npm set-script build:css "sass ./app/assets/stylesheets/application.sass.scss ./app/assets/builds/application.css --no-source-map"

(you might need to touch ./app/assets/stylesheets/application.sass.scss if it’s not there)

After that yarn build:css seems to work, and there is no error

+10

ro31337 on Dec 2, 2021

Have you run yarn build:css --watch? Rails 7 need this process to compile the assets. I think it is not documented yet.

edwinlunando on Nov 24, 2021

With latest cssbundling-rails, yarn build:css is automatically run once when first generating the app. Ensuring you won’t get this missing file error.

But also, you shouldn’t generate a Rails 7 app using a Rails 6 rails command.

dhh on Dec 3, 2021

Btw: here i created a repo wich helps you to create Rails apps in a couple of secods (dockerized) https://github.com/owen2345/create_rails_app

owen2345 on Jan 22, 2022