I recently started working with Rails 3.1. It's a very nice framework
and I like the 'asset pipeline' philosophy. Adding libraries that exist
of one file is quite easy and works out of the box. However, adding a library
which exists of a folder like EXTJS 4 is somewhat more difficult.
I'd like to just add the whole EXTJS4 folder to the '/app/assets' folder
And do a //= require_tree in my 'application.js' file but that does not
include the css files. Also images and scss files are not included this way.
All the images/css files are referenced 'relatively' from the js file so
I think the folder structure should be maintained as it is.
What is the best and easiest way to add this library to my rails projects?
I dont want to specify the whole list of EXTJS resources to my view each time
I create a new view.
Thanks
Simply leaving the Ext library (linked) inside of "public" works just fine.
One caveat here: keep in mind, that if you want sprockets to not interfere, then, while using Rails view helpers, you need the paths to your extjs JS and CSS files to be absolute, e.g. starting with "/". Let's say we have the Ext library in "public/extjs". Then these 2 calls will be needed in your Rails view/layout:
javascript_include_tag "/extjs/ext-all-debug"
stylesheet_link_tag "/extjs/resources/css/ext-all"
Related
I have been working on a face recognition web app, which I use face-api.min.js from this official website https://justadudewhohacks.github.io/face-api.js/docs/index.html
The js file is in min.js type, where I can just refer in in normal html and js file. However, when I put in Rails 6, it shows faceapi is not defined, where I pretty sure it doesn't able to load it. I put the min.js file in my assets/javascript/packs and writing a java script file to perform the logic. It works fine with normal html, js file but when in rails it just doesnt work
BTW this is the js file https://github.com/justadudewhohacks/face-api.js/blob/master/dist/face-api.min.js
Does any one know how can I import this?
I had issues adding select2 and requiring the js properly in Rails 6 app. It was a preconfigured app from work and config is not my strong suit as I didn't want to change something that would affect the greater application. This blob post that helped a ton.
Basically it has you download the select2 files and add them to the packs in a custom folder, then require that folder in your packs/aplication.js
For my rails app, the webpacker-bundled application.js is already too large (~2M) because of jquery, quill, and some other js dependencies. Currently, I am bundling everything into a single js file, which is loaded by every HTML page. As a result, the page loading time is not acceptable.
So I am thinking of a few methods to fix this problem:
generate different application.js for different layouts.
use webpack externals for jquery, quill, and some other dependencies.
Are these the best options? Any suggests?
Hi I am new to Rails and web development in general. I want to implement a template that I have gotten from http://html5up.net/. The template is Big Picture.
Html5up.net uses a skel.js framework (first time using. Only knew about it when I downloaded the template) and I do not know how to incorporate it to my rails application (such as placing the scripts and stylesheets provided into which folder).
I have tried doing it via the default rails way, which is placing the stylesheets my /app/assets/stylesheets folder and also the javascripts in the javascript folder. But it did not turn out correctly. I suspect skel.min.js has its own way of finding the stylesheets.
As such, my web application looks unstyled currently.
When lacking a gem for the assets pipeline, you can always include the source file inside app/assets/javascripts and the include it in the manifest.
Say you moved your skel.min.js into said folder. Now go to application.js and append the following line
//= require skel.min
and that's it. You must now call that file in the application layout file, using the javascript_include_tag helper.
Pretty basic question here:
I on rails 3.2.17, need to include some coffeescript to my application, would rather not add it to my views.
my views folder is named episodes and would like to connect partial _show_info.html.erb to assets/javascript/episodes.js.coffee
just need the proper javascript include tag.
Thanks in advance.
I would recommend adding this to your app/assets/javascripts/application.js file:
//= require episodes
That way, you'll have access to it everywhere, and when you push to production, it'll be minified and concatenated with all the rest of your JavaScripts. You can read up on the asset pipeline here. Especially check out the section on JavaScript Compression.
When writing javascript for a specific page in a site, when do you want to turn the javascript into a function and include it in application.js?
I've seen suggestions about doing this (and minifying or gzip-ing) to minimize HTTP requests. That makes sense, but what about maintainability? If I have js code specific to one view, it seems like more work to look into a potentially massive application.js. That code could be embedded into that view or put in its own .js (or .js.erb or .rjs) file in that view folder.
I've seen another suggestion that Rails automatically merges all javascript into one file. Is this true?
TLDR: how much or how little should a developer worry about optimization when writing javascript?
As I haven't seen an answer in about a month, I'll answer this question to the best of my current knowledge.
Rails 3.1 (currently at release candidate 4) introduces sprockets, which will compile all javascript in a rails project into one file. It even comes with tools to minify and compress javascript so that it's all delivered to the client at once.
Related to sprockets is the Rails 3.1 asset pipeline. As I understand, it's a folder hierarchy/abstraction. Javascripts can go into 3 folders:
/apps/assets/javscripts/
Javascript files specific to the application, including application.js. This should only contain the manifest of javascript files you want to include in your project. The rails new tool will generate this file and include jquery in the manifest.
/lib/assets/javascripts/
Javascript files written by the developer that are more general purpose. (My impression is that this would be for javascript libraries you develop to drop into multiple applications)
/vendor/assets/javascripts/
Third party javascript files (i.e. JQuery, Modernizr)
All files in these folders will appear to the client inside /assets/, abstracting out the server side file paths. I assume this is meant to help the developer organize javascript files.
To answer my own question
Put javascript functions into separate files, group them logically. My test app indicated that subfolders within .../assets/javascripts/ are ok if and only if the subfolder path is included in the manifest.
I.E. putting //= subfolder/js_file in the manifest will work. Putting //= js_file will not if js_file is inside .../javascripts/subfolder/
DHH mentions a "rule of 13" in his talk (linked below). If the number of javascripts in a folder exceeds 13, it starts to look messy and unmanageable. This would be a good time to group javascript files into subfolders.
Use the built in Rails 3.1 minifier and compressor (or install a preferred gem)
Refactor javascript code from time to time. Move functions to /lib/assets/javascripts/ over time. (The goal is to eventually recognize when you want to write general purpose javascript functions as opposed to application-specific ones and eliminate this refactor step)
More Resources
a blog post covering all changes in Rails 3.1
DHH's talk on Rails 3.1 changes, May 16 2011 (~1 hr)