Still works over a year later. Im following a course and it uses rails 6 and my app is in rails 7 and this saved me so much time. Quick and easy to follow
Thank you! It works great! If anyone has issues just double check your files vs his. Sometimes a semicolon is added quickly. Sometimes you need to delete a little more.
To save someone hours of work. This tutorial worked for me in the past. However, I could not get it to work today. I tried for hours. This one works. ua-cam.com/video/Z2gllK3rR3U/v-deo.html&ab_channel=BenNguyen If someone is trying to use Heroku you have to push one step at a time to get it to work.
Thank you, this is spot on, I got it working right away on my existing Rails 7.2 project. I just can't work out how I can now override the bootstrap variables to match your own theming, because Bootstrap's guide to this says you need to override them after the functions are included but before the rest of bootstrap, whereas with the cssbundler-rails install, it's just included as one monolith. I realise it's a long shot as it's a 2 year old video, but if anyone has any advice on this I'd really appreciate it!
I've answered my own question - just copied out the contents of /node_modules/bootstrap/scss/bootstrap.scss to my application.bootstrap.scss and inserted the variable overrides as recommended by the Bootstrap docs. Thanks again for the guide!
I keep getting this error in development: Asset `application.js` was not declared to be precompiled in production. Declare links to your assets in `app/assets/config/manifest.js`. Not sure what to do, because if I include the application to the manifest file, the dropdown keeps not working.
@@ansellgabrieldelayre2630 have you looked at the article? mixandgo.com/learn/ruby-on-rails/how-to-install-bootstrap Maybe there's something you've missed there?
Great video, thanks for the detailed steps. I installed this on an existing ror app and after finishing the steps from the video I got the error "Error ActionView::Template::Error (Asset `application.js` was not declared to be precompiled in production." I could fix this by running the rails javascript:install:esbuild command again.
@@AriefRizkyRamadhan Awesome rails assets:precompile resolved my issue. but this command should be added to the blog. else many of us don't know how to resolve this issue. for me, it took more than 4 days (learning it in my rest time) to resolve this. :) :)
Thank you for video, but Im still stuck with same problem. Dropdown work sometimes, not always. On one site is random, cant see pattern. On other site dropdown does not work after I log in, or sometimes after I log out, but if I then refresh page, drop down works fine. I would be grateful if someone can help as Im having problem with this for weeks.
tbh Im not sure how to update frame instead of replacing. Trying to get info about it on chatgpt, what I tried didnt work and some stuff was too complicated. @@mixandgo
Thanks! Btw i have a question on a warning When i do javascript:install:esbuild it did fix the bootstrap dropdown menu but now my app gave preload error warning and make new request every page change Is it fine? Or is there any workaround?
@@mixandgo after some dividing apparently the warning only appear after the javascript include tag on the application.html.erb, could it be because my ruby version that is 2.7.1? Or maybe conflict on turbo?
Also on new project with esbuild and bootstrap the error didnt show but the bootstrap dropdown dont work immediately until i do the esbuild install again but the warning is back after that
I noticed you are using yarn 1.22.18, which is before the Yarn Plug'n Play. I upgraded to 4.10, which does use it, but it's making things difficult. For one, it adds "-load-path=node_modules" to my build:css:compile script, but does not build the node_modules folder, etc... it builds the pnp.cjs and accompanying loader. As a result, I'm getting Error: Can't find stylesheet to import. ╷ 1 │ @import 'bootstrap/scss/bootstrap'; │ ^^^^^^^^^^^^^^^^^^^^^^^^^^ directly when I try to run ./bin/rails css:install:bootstrap. I want to give PNP a try because it does sound like a good idea to embrace it, but it's not working for. What are your thoughts with that please?
@@mixandgo I wound up giving up on PNP and going back go 1.22.18... much simpler. Also, I noticed that when I was using 4.10 / PNP that the console comments said it was experimental.
@@RichardNavarrete1 makes sense. There are plenty of dependencies breaking in the latest versions of Rails. Adding one more doesn't sound very appealing to me :)
@@CD-zd6zr I just tried it again locally (Rails 7.0.4.2). Got no errors rails new proj_name bundle add cssbundling-rails ./bin/rails css:install:bootstrap
Still works over a year later. Im following a course and it uses rails 6 and my app is in rails 7 and this saved me so much time. Quick and easy to follow
Thank you.
This video is priceless it saved my project in under 5 minutes, Keep making these. 👏
Glad to hear that 💪
Thanks, last time I worked on Ruby on rails 5 and now i have no idea what the hell happened to the asset pipeline. Keep going!
There are new tools available now. Better tools ;)
Incredible production quality and content, thank you sir!
You're too kind :) Thank you.
Thank you! It works great! If anyone has issues just double check your files vs his. Sometimes a semicolon is added quickly. Sometimes you need to delete a little more.
To save someone hours of work.
This tutorial worked for me in the past. However, I could not get it to work today. I tried for hours.
This one works.
ua-cam.com/video/Z2gllK3rR3U/v-deo.html&ab_channel=BenNguyen
If someone is trying to use Heroku you have to push one step at a time to get it to work.
Thank you, this is spot on, I got it working right away on my existing Rails 7.2 project. I just can't work out how I can now override the bootstrap variables to match your own theming, because Bootstrap's guide to this says you need to override them after the functions are included but before the rest of bootstrap, whereas with the cssbundler-rails install, it's just included as one monolith. I realise it's a long shot as it's a 2 year old video, but if anyone has any advice on this I'd really appreciate it!
I've answered my own question - just copied out the contents of /node_modules/bootstrap/scss/bootstrap.scss to my application.bootstrap.scss and inserted the variable overrides as recommended by the Bootstrap docs. Thanks again for the guide!
Thank you! It's very useful video and helps resolve my problem.
Happy to hear
You don't have any idea how this less than 5-minute video saved my deadline... THANKS!
Happy to hear that :)
I keep getting this error in development: Asset `application.js` was not declared to be precompiled in production.
Declare links to your assets in `app/assets/config/manifest.js`.
Not sure what to do, because if I include the application to the manifest file, the dropdown keeps not working.
Hi Victor. No idea without some context.
i have the same issue
Asset `application.js` was not declared to be precompiled in production.
Declare links to your assets in `app/assets/config/manifest.js`.
@@ansellgabrieldelayre2630 have you looked at the article? mixandgo.com/learn/ruby-on-rails/how-to-install-bootstrap Maybe there's something you've missed there?
@@mixandgo Thank you; it is now operational.
Thanks, I meet the problem when I using 'rails new -c bootstrap app1' command. Your video help me a lot.
Great video, thanks for the detailed steps. I installed this on an existing ror app and after finishing the steps from the video I got the error "Error ActionView::Template::Error (Asset `application.js` was not declared to be precompiled in production." I could fix this by running the rails javascript:install:esbuild
command again.
It's a very useful!
Thank you
Thank you, you're the best!
You're welcome :)
i installed using the -js esbuild --css but the functions for the bootstrap navbar wont work. been trying for a while now.. pls help
This video should fix that. If you need 1:1 help, you can book a call on my website:
mixandgo.com/lp/book-call.
where can I add custom css code?
thank you
hey! how display form in bootsrap modals?...
Check out this video: ua-cam.com/video/VtzTTy65EMY/v-deo.html
Great video, I have exactly the same thing and dropdowns still not working...
Thank you Raul. What isn't working?
i am still facing that problems (The asset "application.css" is not present in the asset pipeline.)
plz sove this
thanks
🙏🙏
Can try run rails assets:precompile
@@AriefRizkyRamadhan Awesome rails assets:precompile resolved my issue. but this command should be added to the blog. else many of us don't know how to resolve this issue. for me, it took more than 4 days (learning it in my rest time) to resolve this. :) :)
Thank you for video, but Im still stuck with same problem. Dropdown work sometimes, not always. On one site is random, cant see pattern. On other site dropdown does not work after I log in, or sometimes after I log out, but if I then refresh page, drop down works fine. I would be grateful if someone can help as Im having problem with this for weeks.
It's probably because you are replacing the frame, instead of updating it?
tbh Im not sure how to update frame instead of replacing. Trying to get info about it on chatgpt, what I tried didnt work and some stuff was too complicated. @@mixandgo
Thanks! Btw i have a question on a warning
When i do javascript:install:esbuild it did fix the bootstrap dropdown menu but now my app gave preload error warning and make new request every page change
Is it fine? Or is there any workaround?
No idea. It should behave as you see in the video. So if it doesn't do that, then it's not fine.
@@mixandgo after some dividing apparently the warning only appear after the javascript include tag on the application.html.erb, could it be because my ruby version that is 2.7.1? Or maybe conflict on turbo?
Also on new project with esbuild and bootstrap the error didnt show but the bootstrap dropdown dont work immediately until i do the esbuild install again but the warning is back after that
What about having Bootstrap and staying with importmaps? How do you do that?
There seems to be an issue atm with that setup (with Popper not working). Check out this thread: github.com/rails/importmap-rails/issues/65
Actually creating a new rails app doesn't work with bootstrap + esbuild. Asset pipeline Propshaft or Sprocket choice doesn't matter.
The link to the course is getting a 500 error
Thank you for the heads up. I've updated the link.
I noticed you are using yarn 1.22.18, which is before the Yarn Plug'n Play. I upgraded to 4.10, which does use it, but it's making things difficult. For one, it adds "-load-path=node_modules" to my build:css:compile script, but does not build the node_modules folder, etc... it builds the pnp.cjs and accompanying loader. As a result, I'm getting
Error: Can't find stylesheet to import.
╷
1 │ @import 'bootstrap/scss/bootstrap';
│ ^^^^^^^^^^^^^^^^^^^^^^^^^^
directly when I try to run ./bin/rails css:install:bootstrap. I want to give PNP a try because it does sound like a good idea to embrace it, but it's not working for. What are your thoughts with that please?
Haven't tried that yet. I'll let you know if I do.
@@mixandgo I wound up giving up on PNP and going back go 1.22.18... much simpler. Also, I noticed that when I was using 4.10 / PNP that the console comments said it was experimental.
@@RichardNavarrete1 makes sense. There are plenty of dependencies breaking in the latest versions of Rails. Adding one more doesn't sound very appealing to me :)
I keep getting
/* Error: Can't find stylesheet to import.
* ,
* 1 | @import 'bootstrap/scss/bootstrap';
* | ^^^^^^^^^^^^^^^^^^^^^^^^^^
* '
* app\assets\stylesheets\application.bootstrap.scss 1:9 root stylesheet */
Have you ran ./bin/rails css:install:bootstrap ? I should create that file for you.
@@mixandgo that's the command that's giving me that error
@@CD-zd6zr I just tried it again locally (Rails 7.0.4.2). Got no errors
rails new proj_name
bundle add cssbundling-rails
./bin/rails css:install:bootstrap