Is it possible to import a stylesheet from a rails-assets.org gem using scss's import instead of sprocket's require? For example:
Given this Gemfile:
source 'https://rails-assets.org'
gem "rails-assets-RRSSB"
Using a sprockets stylesheet, normally you'd use a require in application.css (working):
*= require RRSSB/scss/rrssb
However, I'm using SCSS and would like to use import in application.css.scss (not working):
#import "RRSSB/scss/rrssb";
Go to your rvm gem directory (rvm gemdir) and look for the gem rails-assets pulled (/gems/rails-assets-YOUR_GEM-VERSION).
In the app/assets/stylesheets directory find your file.
Import/require the file with the path relative to app/assets/stylesheets.
The same goes for javascripts (in app/assets/javascripts).
This worked for me with rails-assets-bootstrap-sass-official, the file I was trying to import was bootstrap-sporckets and it was (including all other files) under app/assets/stylesheets/bootstrap-sass-official so my import was:
#import "bootstrap-sass-official/bootstrap-sprockets"
Related
I have a rails engine, and I want to use bootstrap on it.
I included 'bootstrap' as a dependency. And I want to import in my application.scss file.
However, importing like this:
#import 'bootstrap';
Doesn't work as normal. I suspect that it is because I'm running an engine, and my scss file is placed in a module instead of the /stylesheets directory. However,
#import '../bootstrap';
does not work either.
Any ideas, and in addition, is there something fundamental I should know about rails engines when it comes to referencing by directory and what not? I only ask because this is the first time I've ever worked with a rails engine
UPDATE
It appears that also the jquery-rails gem (in addition to boostrap) could not be found when I require it in my application.js file like this:
//= require jquery-rails
//= require bootstrap
I figured it out. I just had to change:
s.add_dependency 'bootstrap'
to this:
s.add_dependency 'bootstrap', '~> 4.1.3'
Bootstrap is not loading for me. What am I doing wrong?
application.scss (complete file, nothing else in it)
// "bootstrap-sprockets" must be imported before "bootstrap" and "bootstrap/variables"
#import "bootstrap-sprockets";
#import "bootstrap";
#import "bootstrap/theme";
Gemfile
gem 'bootstrap', '~> 4.0.0.alpha4'
gem 'bootstrap-sass', '~> 3.1.1'
gem 'bootstrap-sass-extras'
HTML IN HEADER SHOWS (running rails s, in development mode):
<link rel="stylesheet" media="all" href="/stylesheets/application.css">
have you try :
rails generate bootstrap:install static
rails generate bootstrap:install less
This is a little hard to track down with the information you provided. Have you renamed your style files to .scss extention? Make sure you follow the installation instructions in the docs: Bootstrap 4 alpha.
It looks like you are using extra gems you don't need. If you are using the alph 4 version of bootstrap, you only need that in your gem file, you do not need version 3. Make sure include the right dependencies in your application.js file:
//= require jquery
//= require bootstrap-sprockets
as well as:
#import "bootstrap";
in your application.scss file.
You have to configure these files and then make sure you restart your application in order for the changes to take place. Hope this helps!
I followed stack overfolw's answer
to add adminlte in my rails app
it also says to add
//= require adminlte
in application.js
it works fine on local system but now when I am trying to deploy to digital ocean droplet it gives error
Sprockets::FileNotFound: couldn't find file 'adminlte' with type 'application/javascript'
My gemfile(I removed all gems except relavent) to clear the adminlte issue
source 'https://rubygems.org'
gem 'bundler', '>= 1.8.4'
gem 'pnotify-rails'
source 'https://rails-assets.org' do
gem 'rails-assets-adminlte', '2.3.3'
end
end
I normal cases we write
source 'https://rubygems.org'
gem 'pnotify-rail'
and in application.js
//= require pnotify
and don't include any file like pnotify.js manully
But in this case I instead used
source 'https://rails-assets.org' do
gem 'rails-assets-adminlte', '2.3.3'
end
and for this
//= require adminlte causing issue
From What I understand, you do not have a file named adminlte in your javascript folder.
Your app/assets/javascripts/ must have all the files that you want to require in your application.js
So if you have required adminlte, you must also have a file with the same name in your javascripts folder.
I see that you are using a theme, you might want to consider copying all the javascript and css files to the respective folders. If you have a folder to require, you could use // require_tree ./adminlte which requires all the files in that folder.
I hope this helps :)
I had the same problem, having to import adminlte on some servers and AdminLTE on others.
Just use rails-assets-admin-lte instead of rails-assets-adminlte (they're based on the same code) and import admin-lte instead of adminlte in your CSS and JS application files.
I create a new rails project,and add
gem 'bootstrap-sass'
to my Gemfile, then I run bundle install and every things going good. then I add:
/*
*= require bootstrap
*/
in my application.css file, and I write a test,but it doesn't.
and I also try add`#import "bootstrap"; in my hello.css.scss file .but it also doesn't work.
Rollen,
You seem to be mostly there. Sass is in Rails 3.1 by default so you won't need to do anything specific for that. After you add the gem to your Gemfile and do a bundle install your issue is in the application.css file. Typically when using Sass I'd just suggest that you remove the manifest code (all the commenting at the top) from the application.css and rename the application.css to application.css.scss (removing Sprockets from the CSS file). Then add:
#import 'bootstrap'
to the very top of it. That should solve it for you. You'll need to manually add each CSS file you'll want to load into the application.css.scss file since sprockets is gone, but that's typically a good idea anyway since load order in CSS is important for the cascade.
If you want to add the JavaScript features to the framework (which you likely will want to) you'll also want to add
//= require bootstrap
Just above the call to //= require_tree . within app/assets/javascripts/application.js.
Probably a little late to the party, but just in case anyone else stumbles across the question...
This was a small gotcha I Solved by adding #import "bootstrap"; to the top of my application.css file, the renamed the file to application.css.scss
Hope this helps.
https://github.com/rails/sass-rails needs to be there in your Gemfile.
gem 'sass-rails', '~> 3.1'
gem 'bootstrap-sass', '~> 2.0.1'
Remove all the comments at the top of the application.css and rename application.css to either application.sass or application.css.scss depending on how you want to do your css'ing
Then add:
#import 'bootstrap'
This should allow you to start using bootstrap, providing you have indeed included the bootstrap-sass gem correctly and ran bundle install afterwards.
I recently upgraded to rails 3.1 and also installed the Bourbon gem in my rails 3.1 app. Added this to my gemfile: gem 'bourbon' and ran $ bundle install but when in my application.css.scss I add the #import "bourbon"; line, i get the following error:
File to import not found or unreadable: bourbon.
Load path: Sass::Rails::Importer ...
here is my application.css.scss file
/*
* This is a manifest file that'll automatically include all the stylesheets available in this directory
* and any sub-directories. You're free to add application-wide styles to this file and they'll appear at
* the top of the compiled file, but it's generally better to create a new file per style scope.
*= require_self
*/
#import "bourbon";
#import "scaffold.css.scss";
.hidden{
display:none;
}
any idea how to load Boubon? what am I doing wrong?
I am guessing there need to be some files that need to be generated for rails to access bourbon library, no?
Any help or clues will be much appreciated
alik, try specifying the gem version number in your gemfile. https://rubygems.org/gems/bourbon
gem "bourbon", "~> 0.2.1"
rake bourbon:install will not help you on rails 3.1+