I created a site and some javascript and css files that I only use on one site (they would disturb functions on other sites), but I don't know how to exclude the files from the asset pipeline.
In the asset javascript folder I created a new folder called paint that contains all javascript files I don't want to load on all sites. But only on one specific site.
Also I created a folder in assets stylesheetsy directory for the stylesheet I only need on the specific site.
My application.js looks like this:
//= require jquery
//= require jquery_ujs
//= require twitter/bootstrap
//= require fancybox
//= require_tree .
//= require bootstrap-datepicker
//= require_self
I hope somebody can help me! Thanks
Remove this line
//= require_tree .
And require only the files that you need
Related
I'm using Rails and Foundation 5.5.3. Foundation loads all the .js files that I don't really need and I would like to remove them.
I found a few solutions for an older version of Foundation, but can't figure out how it works for my version.
I tried to follow this tutorial, I can't find that index.js file anywhere (he starts explaining around 10:00): http://railscasts.com/episodes/417-foundation?autoplay=true
I deleted //= require foundation inside my application.js file and added what I needed:
//= require foundation/foundation
//= require foundation/foundation.dropdown
//= require foundation/foundation.abide
//= require foundation/foundation.tooltip
//= require foundation/foundation.topbar
I use the bootstrap gem installed (alpha-v6) in a rails 5 app. I have a dropdown in my navbar which implemented exactly as the example in the documentation.
But it is currently only working either in production or in development, depending on what I require in my application.js:
Works in development:
//= require jquery
//= require tether
//= require bootstrap-sprockets
//= require jquery_ujs
//= require turbolinks
//= require_tree .
works in production:
//= require jquery
//= require tether
//= require bootstrap
//= require bootstrap-sprockets
//= require jquery_ujs
//= require turbolinks
//= require_tree .
I know the documentation says you should not require both bootstrap and bootstrap-sprockets. But so far I can not find another way to make it work in production.
What am I missing?
First of all, I highly recommend using the bootstrap-sass gem so you can take advantage of bootstrap's sass variables, classes, mixins, etc. It's also a little easier to integrate with your rails apps in my opinion, and if you want to use it the same way as your previous bootstrap gem then you can do that too. My answer banks on you using the bootstrap-sass gem.
According the bootstrap gem documentation, you should not include both bootstrap and bootstrap sprockets.
According to the docs:
bootstrap-sprockets provides individual Bootstrap Javascript files (alert.js or dropdown.js, for example), while bootstrap provides a concatenated file containing all Bootstrap Javascripts.
So to properly include bootstrap's JavaScript functionality:
//= require jquery
//= require jquery_ujs
//= require bootstrap
//= require turbolinks
//= require_tree
Also, this assumes you're using the gem bootstrap-sass
I have it currently working by explicitly calling the dropdown function every time turbolinks reloads the page.
//= require jquery
//= require jquery_ujs
//= require tether
//= require bootstrap
//= require turbolinks
//= require_tree .
$( document ).on('turbolinks:load', function() {
$('.dropdown-toggle').dropdown();
})
But I should not have to do this so I would really like to have a real answer to the problem.
I am fairly new to Rails and have encountered a problem that I can't understand. I'm trying to add the Trix editor to my application. I installed it with the gem and it worked fine...but only in development. In production it does not load the editor. I can also get it to fail in development if I change:
config.assets.debug = false
in development.rb
I have verified that the code is included in the precompiled .js file. It looks something like:
<script src="/assets/application-xyz" data-turbolinks-track="reload"></script>
The only way I am able to get it to work is by explicitly declaring the Trix CSS and JS file in the header:
<link rel="stylesheet" type="text/css" href="/assets/trix.css">
<script type="text/javascript" src="/assets/trix.js"></script>
I'm confused why that would even work because those files aren't even in the assets folder...perhaps they are automatically added by the gem? Anyway, it works even in production but it seems like a bad idea.
application.js:
//= require jquery
//= require jquery_ujs
//= require turbolinks
//= require bootstrap
//= require trix
//= require_tree .
Is there any reason why it would appear in the precompiled js file yet not load properly? I'm not sure how to narrow down the source of the error. Is there any way to tell in developer tools whether it's being loaded or whether there is an error?
I realized that your problem is the way you're adding bootstrap to your project, in your assets/stylesheets you have both the unminified and the minified version of those two files, bootstrap.js and bootstrap.css and also you're adding them again to your project in both application.js and application.css files.
What I did was to remove all the css and javascript files that weren't being used, as the duplicated of bootstrap files and scaffold's autogenerated files, and also comment or delete the way you were adding Trix to the project, this way you also have a Trix call in your both application files.
# application.js
//= require jquery
//= require jquery_ujs
//= require turbolinks
//= require trix
//= require_tree .
Note there's no Bootstrap call because they're already being loaded with require_tree
# application.scss
/*
*= require trix
*= require_self
*= require_tree .
*/
And also you have Trix added in your Gemfile, so you can call it making a require in your 'assets' application files.
I decided to try and add Parsley to my rails application. But before I get to deal with that at all, I already stopped all of the javascript and datatables from working just by adding //= require parsleyto my application.js file.
So here it is:
//= require jquery
//= require parsley
//= require jquery_ujs
//= require jquery-ui
//= require dataTables/jquery.dataTables
//= require dataTables/jquery.dataTables.bootstrap3
//= require bootstrap
//= require bootstrap/dropdown
//= require_tree .
All I did was add that one line, and everything broke. So I know the order matters, but moving it around hasn't produced results. So I'm hoping someone can shed some light on this. I feel it's either more finicky than it should be, or I'm missing something very basic.
After I placed it there, I ran rake assets:clean and rake assets:precompile, because I assumed that would work...
Thank you for your time.
All I had to do was restart the server, and place the new line of code under //= require jquery. Should I remove my post, or leave it for future confused newbies like myself?
I have just upgraded to Rails 3.1, and I am having an issue with loading my Javascripts with the new asset pipeline.
I have copied the js files (both the files themselves and their .min variants) into my /app/assets/javascripts directory, and my application.js manifest is as follows:
//= require jquery
//= require jquery_ujs
//= require jquery-easytabs
//= require jquery-hashchange.min
//= require_tree .
But this does not appear to be working; Easytabs is not being loaded correctly. Strangely, when I look in the console at the application.js file that is compiled, I can see the Easytabs code, but it is not working.
I have found that if i paste the code directly into the application.js file, it works as expected, so I know that the script is working. This is not, however, the intended use of the application.js file.
I would appreciate any guidance on where to go next in order to ensure the correct loading of the js files.
Thanks!
Try moving all your plugins (like easytabs) into the vendor directory.
vendor/assets/javascripts/
Then change your application.js file to this:
//= require jquery
//= require jquery_ujs
//= require_tree ../../../vendor/assets/javascripts
//= require_tree .
You should (if you aks me) only place code that you have written for a specific controller in your app/assets/javascripts directory, everything else, like plugins should go in the vendors dir.
I managed to get to the bottom of this - it seems that the require order is alphabetical, so jquery_easytabs was getting compiled before jquery_ujs. I fixed this by renaming to jquery_zeasytabs - not the cleanest, but it does work.