In my application.js, I have the manifest for external js files as such
//= require jquery
//= require jquery-ui-1.8.17.custom.min
//= require jquery_ujs
//= require jquery-mousewheel.js
//= require jquery-fileupload
//= require jquery-fileupload-ui
//= require_self
//= require bootstrap.min.js
//= require rails.validations
//= require rails.validations.custom
//= require jwplayer
//= require jwplayer.html5
//= require jwplayer-license
When I run my web app in IE8, I get this error:
Message: 'n.sheet.cssRules' is null or not an object
After some searching, I traced the error back to the jwplayer.html5.js file. Is there a way to exclude this file from within application.js when IE8 is detected?
I ran into the exact same issue with the same setup (Rails 3, JWPlayer 6.1.x, etc). For what it's worth, upgrading to JWPlayer 6.2.x didn't resolve the issue
I don't have a solution, but I do have a workaround. I pulled JWPlayer out of my application.js, added <%= yield :javascripts %> to my application.html.erb, and moved the JWPlayer includes to only the view where I needed them:
<% content_for :javascripts do %>
<%= javascript_include_tag "jwplayer" %>
<%= javascript_include_tag "jwplayer.html5" %>
<% end -%>
Note that in my case, I also had to add those files to config.assets.precompile.
Essentially what's happening is that IE8 (and presumably 7) is freaking out if there's no instance of JWPlayer on the page. The ideal fix would actually be for JWPlayer itself to check if that's the case instead of letting IE throw an error, but until they fix it on their end, this at least gets things working.
It's frustrating and far from an ideal solution, but it worked in my application.
I was struggling with this too. I did some work on the jwplayer-rails gem. I am still waiting on my pull request to go through. For now follow the info in this readme to get it up and running. Read more on my answer here.
Related
I am using materialize-sass and simple_form gems along with materialize-form gem on a brand new app. I add materialize-sass gem and all seems to work fine. Once i add the materialize-form gem following the gem githib page and reload the app, i start getting the following error.
Uncaught TypeError: $(...).material_select is not a function
at Object.initSelect (materialize-form.self-89fda0734fca24f0d2616fd681f296b51ac68a36ebdc1fcec6767a6543545064.js?body=1:9)
at Object.init (materialize-form.self-89fda0734fca24f0d2616fd681f296b51ac68a36ebdc1fcec6767a6543545064.js?body=1:3)
at HTMLDocument.<anonymous> (materialize-form.self-89fda0734fca24f0d2616fd681f296b51ac68a36ebdc1fcec6767a6543545064.js?body=1:23)
at fire (jquery.self-bd7ddd393353a8d2480a622e80342adf488fb6006d667e8b42e4c0073393abee.js?body=1:3233)
at Object.fireWith [as resolveWith] (jquery.self-bd7ddd393353a8d2480a622e80342adf488fb6006d667e8b42e4c0073393abee.js?body=1:3363)
at Function.ready (jquery.self-bd7ddd393353a8d2480a622e80342adf488fb6006d667e8b42e4c0073393abee.js?body=1:3583)
at HTMLDocument.completed (jquery.self-bd7ddd393353a8d2480a622e80342adf488fb6006d667e8b42e4c0073393abee.js?body=1:3618)
I have ensured that jquery is loaded before materialize and also materialize is loaded before materialize-form.
my application.js looks like:
//= require jquery
//= require materialize-sprockets
//= require rails-ujs
//= require turbolinks
//= require materialize-form
//= require_tree .
$(document).on('nested:fieldAdded', function(event) {
window.materializeForm.init()
})
still i get the error.
I complete understand your problem. But I can give you some great advice in order you don't have these kind of issues.
1.- Create a materialize.js page under the Javascript folder
2.- This is a small example how I manage my inits: (The use of turbolinks is optional)
$(document).on('turbolinks:load', function() {
$('.modal').modal({});
$('.tabs').tabs();
$('.collapsible').collapsible();
$(".dropdown-trigger").dropdown();
$('.materialboxed').materialbox();
$('select').formSelect();
});
3.- This is how I manage my requires in the application.js file:
//= require jquery
//= require rails-ujs
//= require jquery2
//= require materialize
//= require materialize-sprockets
//= require turbolinks
//= require_tree .
4.- My gems in order materialize works:
gem 'materialize-sass', '~> 1.0.0'
gem 'jquery-rails', '4.1.1'
And thats literally it, I hope this works for you!
It's a constant headache when dealing with websockets, and it kills my performance in addition to adding bugs. Since ActionCable is the whole reason I upgraded I'd very much like to get rid of it completely.
The following was copied from here. It's for Rails 4, but I believe the steps are the same.
Remove the gem 'turbolinks' line from Gemfile.
Remove the //= require turbolinks from app/assets/javascripts/application.js.
Remove the two "data-turbolinks-track" => true hash key/value pairs from app/views/layouts/application.html.erb.
Edit: As of at least Rails 5 the last step should refer to "data-turbolinks-track" => "reload" as opposed to "data-turbolinks-track" => true. Thanks to #boddhisattva
Edit: As of at least Rails 4.2 you can generate a project without turbolinks to begin with. Just use something like this:
rails new my_app --skip-turbolinks
Removing //= require turbolinks from app/assets/javascripts/application.js seems to have done the trick.
I also removed both turbolinks references in app/views/layouts/application.html.erb
If you are using Webpacker (Rails 5-6)
Delete this line from Gemfile and run bundle:
gem 'turbolinks', '~> 5'
Run yarn remove turbolinks
Delete this line from application pack file app/javascript/packs/application.js:
require("turbolinks").start()
Remove any data-turbolinks data attributes from your html.
Change:
<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
<%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
to
<%= stylesheet_link_tag 'application', media: 'all' %>
<%= javascript_pack_tag 'application' %>
you can also do it when you create your rails application by using;
rails new app name --skip-turbolinks
Completely removing the turbolinks tags from application.html.erb might break CSS and JS. add this lines instead of the turbolinks if no CSS or JS is loaded:
<%= stylesheet_link_tag "application", media: "all" %>
<%= javascript_include_tag "application" %>
I have a Rails app with Angularjs parts in it. This app works fine on my local machine, but after deploying to Heroku all the dynamic angular data values are not visible, I only see the handlebars, e.g. {{groundvisit.match_nr}} instead of the actual value 123.
I have a gut feeling it has to do with the asset pipeline, my application.js looks like this:
//= require jquery
//= require jquery_ujs
//= require jquery.fancybox
//= require jquery.fancybox.pack
//= require bootstrap
//= require bootstrap-dropdown
//= require gmaps4rails.base
//= require gmaps4rails.googlemaps
//= require general
//= require angular/angular
//= require angular/angular-resource
//= require angular/base
//= require angular/controllers/groundvisits_ctrl
//= require_tree .
Any clues what is going wrong here?
Update: I know that because of compressing the assets variable names might be hampered with, so I use them like this:
#app = angular.module('MyGroundhops', ['ngResource'])
#GroundvisitsCtrl = #app.controller 'GroundvisitsCtrl', ["$scope", "$resource", ($scope, $resource) ->
I had the same issue. A temporary solution (as long as you understand the tradeoff) is to add this to your /config/environments/production.rb
config.assets.js_compressor = Sprockets::LazyCompressor.new { Uglifier.new(mangle: false)}
I got this from the railscast #405.
This is my second post regarding this issue as my webrick server spits out this message. I've had this before and twiddled with the application.css file to get it to work. My rails is 3.1.3 on ruby 1.9.3. The response from rails is couldn't find file 'twitter/bootstrap'
"all" %>
Researching on Google I've followed seyhunak's responses on this issue. Here is my line in the Gemfile, on its own line and not in a group.
gem 'twitter-bootstrap-rails', :git => 'http://github.com/seyhunak/twitter-bootstrap-rails.git'
Here is what's in my application.css.scss:
*= require_self
*= require bootstrap_and_overrides
*= require_tree .
Here's what's in my application.js
//= require jquery
//= require jquery_ujs
//= require twitter/bootstrap
//= require require_tree .
I have done the following commands:
bundle update
rails g bootstrap:install
rails g bootstrap:layout application fixed
touch bootstrap_and_overrides.css.less
rails s
After restarting the server, I still get that error. I'm unable to get past this.
I think I've exhausted all Stack and Google can suggest. What am I overlooking? thanx, sam
After beating myself up over this, I got some Rails devs to look at this problem. My understanding is that Twitter/Bootstrap needs files to be in the vendor directory. The gem would then need to be removed, commented out, so they would not conflict. My app now shows pages that look like the project's homepage. I'm unsure if I've lost the ability to use less to change things. This is my inexperience showing. Thanks for looking.
Moving gem "twitter-bootstrap-rails" out of group :assets
And doing a bundle install worked for me.
Here is some more information
https://github.com/seyhunak/twitter-bootstrap-rails/issues/91
I have similar problem,
I use application.html.haml instead of application.html.erb
using this link:
HTML to Haml
Code is as:
%html
%head
%title Task
= stylesheet_link_tag "application", media: "all", "data-turbolinks-track" => true
= javascript_include_tag "application", "data-turbolinks-track" => true
= csrf_meta_tags
%body
= yield
You Must install Haml gem first:
install haml gem rails
I have in
<link href="/assets/application.css" media="screen" rel="stylesheet" type="text/css" />
<script src="/assets/application.js" type="text/javascript"></script>
but when I go to http://localhost:3000/assets/application.css
Routing Error
No route matches [GET] "/assets/application.css"
P.S. Rails 3.1.0.rc4, ruby 1.8.7
Seems Sprockets / Rails 3.1 were acting up for me w/ ruby 1.9.2-p180 ... updating to Ruby-1.9.2-p290 seemed to stop the issue.
Maybe not related to your issue... but useful for anyone else having that issue using those versions of Rails & Ruby.
I found that I had something similar going on after updating to Rails 3.1 this evening. I was working on a project that didn't use ActiveRecord, so I had a modified my application.rb to exclude it. The line that usually reads require 'rails/all' to only include the parts I needed, like this:
require "action_controller/railtie"
require "action_mailer/railtie"
require "active_resource/railtie"
require "rails/test_unit/railtie"
This list has changed in Rails 3.1 to include Sprockets, the core component to making the asset pipeline work. I got the asset pipeline serving the serving content as expected by adding this line to the bottom of the list:
require "sprockets/railtie"
After restarting, /assets/application.js and other assets began working as expected.
Note: if you have a custom setup like this, be sure to open the railties gem and look at the contents of lib/rails/all.rb which may have changed (as in this case).
Your scripts and styles will be loaded from the public folder. Drop the assets folder under public and you should be good to go.
In the application layout file, if you have
<%= stylesheet_link_tag "/assets/application" %>
which gives
No route matches [GET] "/assets/application.css"
TRY changing it to
<%= stylesheet_link_tag "application" %>
I had to add the following line in application.rb:
config.assets.enabled = true
in bottom of class Application < Rails::Application