I am trying to install my first gem in Ruby, but am having problems with it working. I am not quite sure where I am going wrong, I am following the directions of the gem step by step. I am using Cloud9 for my ide.
The gem I am trying to install is the: wysiwyg-rails gem
I add the following line to the gem file:
gem 'wysiwyg-rails', '1.2.5'
then I add the following to the application.css file so it looks like:
/*
*= require froala_editor.min.css
*= require froala_style.min.css
*= require font-awesome
*= require_tree .
*= require_self
*/
And finally I add the require .js file to the application.js:
//= require jquery
//= require jquery_ujs
//= require bootstrap
//= require turbolinks
//= require froala_editor.min.js
//= require plugins/tables.min.js
//= require_tree .
I run bundle install and then restart the server. When I try to load the page, I get the error: couldn't find file 'font-awesome'
However, i can see that font-awesome is installed
Using font-awesome-rails 4.2.0.0
If I remove the *= require font-awesome from the application.css, it starts up without any errors. When I view the source code, I can see the css and js files ( froala_editor) load up, but font-awesome is not one of them. Is there a step that I am missing?
Thanks!
the problem is very strange,the reason is unknown,but i resloved in my program,just add "font-awesome-rails" gem.
gem "font-awesome-rails"
Have you tried installing with font-awesome-less or font-awesome-sass gems to get them up and running?
It seems you are running without any sprockets (asset-pipeline). Add any of those gems, it probably run fine when serving rails s.
After bundle install, go to application.css and write this code as it follows:
#import "font-awesome-sprockets"
#import "font-awesome"
Hope that helps.
Related
We're using Rails Assets in our project and we're in the process of updating Ruby from 2.3.7 to 2.4.7, following this guide. I think I've resolved all the gems issues, but when I'm trying to run rspec or navigate to any admin page, I'm greeted with this error:
couldn't find file 'fullcalendar'
This is one of the Rails Assets mentioned above, and I'm not sure why this is happening.
My gemfile:
source 'https://rails-assets.org' do
gem 'rails-assets-jquery'
gem 'rails-assets-jquery-ujs'
gem 'rails-assets-jquery-ui'
gem 'rails-assets-js-cookie'
gem 'rails-assets-lodash'
gem 'rails-assets-highcharts'
# gem 'rails-assets-quill'
gem 'rails-assets-select2'
gem 'rails-assets-select2-bootstrap-css'
gem 'rails-assets-slick.js'
gem 'rails-assets-picturefill'
gem 'rails-assets-scrollmagic'
gem 'rails-assets-gsap'
gem 'rails-assets-fullcalendar'
gem 'rails-assets-moment'
gem 'rails-assets-jstzdetect'
gem 'rails-assets-blueimp-file-upload'
gem 'rails-assets-air-datepicker'
end
/app/views/layouts/admin.haml:
= javascript_include_tag 'admin'
/app/assets/javascripts/admin.js
// This is a manifest file that'll be compiled into application.js, which will include all the files
// listed below.
//
// Any JavaScript/Coffee file within this directory, lib/assets/javascripts, vendor/assets/javascripts,
// or any plugin's vendor/assets/javascripts directory can be referenced here using a relative path.
//
// It's not advisable to add code directly here, but if you do, it'll appear at the bottom of the
// compiled file.
//
// Read Sprockets README (https://github.com/rails/sprockets#sprockets-directives) for details
// about supported directives.
//
//= require jquery
//= require jquery-ujs
//= require jquery-ui/jquery-ui
//= require lodash
//= require bootstrap
//= require moment
//= require quill
//= require fullcalendar
//= require select2
//= require jstzdetect
//= require cocoon
//= require blueimp-file-upload/jquery.iframe-transport.js
//= require blueimp-file-upload/vendor/jquery.ui.widget.js
//= require blueimp-file-upload/jquery.fileupload.js
//= require_tree ./admin
What have me scratching my head is that the assets above fullcalendar are loading fine, but this one throws an error.
This app is running on Rails 4.2.7.1 and ruby 2.3.7. I'm trying to update Ruby version to ruby 2.4.7.
Try replacing require fullcalendar with
require fullcalendar/core/main.js
require fullcalendar/daygrid/main.js
Just a guess based on the doc
Alternatively, just remove it from assets and put the files directly in vendor folder; or use this gem.
I get the following error after updating Devise bootstrap views to the latest version (1.1.0). Everything works OK if I switch back to v0.0.11.
What is the problem?
In my Gemfile I have this
gem 'devise'
gem "twitter-bootstrap-rails"
gem "devise-bootstrap-views"
application.css
/*
*= require devise_bootstrap_views
*= require_tree .
*= require_self
*/
bootstrap_and_overrides.css
/*
=require twitter-bootstrap-static/bootstrap
Static version of css will use Glyphicons sprites by default
=require twitter-bootstrap-static/sprites
*/
application.js
//
//= require rails-ujs
//= require jquery
//= require twitter/bootstrap
// require turbolinks
//= require Chart.bundle
//= require chartkick
//= require_tree .
I know this is an old question, but I guess this is a duplicate of Question #52636393.
I had this same problem while updating dependencies from an old project of mine. All I had to do was to remove the following line from application.css
*= require devise_bootstrap_views
Look for this line in your css/sass files and try removing it. Oh, and remember to restart your server :)
I hope it helps.
My computer system is Mac OS. In the past few days, I was working on a rails project and I tried to use Bootstrap in my app. Followed by the instruction of Bootstrap website, I changed some files' contents but it still didn't work. Can somebody help me?
This is the code in application.scss:
#import "bootstrap-sprockets";
#import "bootstrap";
This is the code in application.js:
//= require rails-ujs
//= require activestorage
//= require turbolinks
//= require_tree .
This is my Gemfile:
gem 'bootstrap-sass', '3.3.7'
I have also run 'bundle install' on my console. However, nothing happened in my pages.
Your application.js is missing the bootstrap files. Add those and you are good to go. Just add the below
//= require bootstrap-sprockets
to the application.js
I try to install react-router and material-ui on my rails 4 app but I get Sprockets::FileNotFound error for react-router and material-ui. I follow instructions from rails-assets.org.
My Gemfile:
source 'https://rails-assets.org' do
gem 'rails-assets-classnames'
gem 'rails-assets-lodash'
gem 'rails-assets-react-router'
gem 'rails-assets-material-ui'
end
application.js
//= require jquery
//= require lodash
//= require jquery_ujs
//= require react
//= require classnames
//= require react_ujs
//= require react-router
//= require turbolinks
//= require_tree .
And after bundle I got this notification on some gems This component doesn't define main assets in bower.json.. Thank you for your time and I hope we work this out.
UPD 1:
I found kind of a solution on stackoverflow but I would like to stick to rails-assets.org way if possible.
ruby '2.2.0'
rails '4.2.3'
Might be easy to forget, but have you restarted your (running) rails server?
Started to use rails-assets yesterday as well and it showed me the exact same problem (Sprockets::FileNotFound).
I restarted the running server in the console and the problem was solved.
Rails 4.2.5
/ Ruby 2.3.
I think I am missing a vital step:
When installing a gem (ie. bootstrap-wysihtml5) what steps should I take for it to correctly find and reference the javascript and css files.
I add gem bootstrap-wysihtml5 to my gemfile, and run bundle install.
I place //= require bootstrap-wysithtml5 in application.js and *= require bootstrap-wysithtml5 in application.css.
I get the following error:
Error compiling CSS asset
Sprockets::File not found: couldnt find file 'bootstrap-wysihtml5.css'
Do I have to manually copy the js and css to the relevant app/assets file, or is there a crucial step I'm missing?
As Billy said, the correct gem is bootstrap-wysihtml5-rails. The gem installs the JS/CSS without further effort on your part.
Add this to your Gemfile:
gem 'bootstrap-wysihtml5-rails'
Add this to app/assets/javascripts/application.js:
//= require bootstrap-wysihtml5
Add this to app/assets/stylesheets/application.css:
*= require bootstrap-wysihtml5
Note that bootstrap-wysihtml5-rails requires Bootstrap. If you have not already added Bootstrap to your project, follow these steps from the creator of this gem:
In Gemfile, add the following:
gem 'anjlab-bootstrap-rails', :require => 'bootstrap-rails',
:github => 'anjlab/bootstrap-rails'
Rename app/assets/stylesheets/application.css to app/assets/stylesheets/application.css.scss
Add the following to app/assets/stylesheets/application.css.scss:
#import "twitter/bootstrap";
Add the following to app/assets/javascripts/application.js:
//= require twitter/bootstrap
Once the gem & Bootstrap are both installed, initialize wysihtml5.
<textarea id="some-textarea" class='wysihtml5' placeholder="Enter text ..."></textarea>
<script type="text/javascript">
$(document).ready(function(){
$('.wysihtml5').each(function(i, elem) {
$(elem).wysihtml5();
});
});
</script>
I found the solution! Thanks for your help guys.
By moving the position of the javascript references to this order, it now seems to work.
//= require jquery
//= require jquery_ujs
//= require bootstrap-wysihtml5/b3
//= require bootstrap/bootstrap
I have no idea why the order would make such a difference. But it works now! Thanks.