I'm planing to create a simple Ruby gem. The functionality is depending on some .js files. My plan is to install the gem via Github.
My questions are:
should I write a generator to copy the js files?
what is the best place to keep the js files (is it vendor/assets/javascripts?)
how to write test cases for this (rspec2) ?
I'm using Rails > 3, Ruby 1.9.x and Ruby 2.x.
We can easily use Javascripts library in ruby in following way -
1) We can put all js libararies in Vendor section and for their use
we can define then application.js in following way
//= require datatable-pagination
.
.
2) Next if you want to use your own javascript then u put them into
your assets folder and use then application.js in above way.
3) And if you want to make your own js library, then you can put
your js libarary in lin folder.
Related
What are the best practices of compiling files? Should i make 1 compiled js file with a lot of unused libraries on different pages? Or should i manually compile different files for different pages?
What I suggest is you can organize your JS and CSS into categories like this
frameworks.js - includes Jquery, Bootstrap JS etc
application.js - specific to your application
You can do the same thing with the css files
framework.css
application.css
I would take all of your application JS files like login.js, validation.js etc and compile those into application.js
Same idea with the css files.
All of your dependencies will be in one file and application specifc JS into your main application.js file
There is a similar question: Rails 4: Where to put JavaScript/CSS plugins. But none of the answers actually answer my question.
This plugin is third-party, so I'd like to put it somewhere in vendor directory (and not in the assets directory).
Also I think it's better to keep all the plugin files in one directory, so I don't want to spread js, css files and images into different directories.
So is there any nice way of dealing with vendor js plugins in Rails 4?
Add the third party plugin as:-
Approach 1:-
Consider the example, to add gem 'bootstrap-sass', do like that:-
In Gemfile:-
gem 'bootstrap-sass', '3.3.1', :path => 'vendor/bootstrap-sass-3.3.1'
Puts the whole plugin of bootstrap in vendor/ folder so the directory structure will looks like
vendor/bootstrap-sass-3.3.1/assets/
vendor/bootstrap-sass-3.3.1/lib/
vendor/bootstrap-sass-3.3.1/tasks/
vendor/bootstrap-sass-3.3.1/ #other directory and files
Approach 2:-
If only third party js files are included, then put js files in vendor/assets/javascripts/ and require it in application.js as :-
//= require file_name_without_js_extension
Example:-
//= require jwplayer
For css, put css files in vendor/assets/stylesheets/ and require it in application.css as :-
*= require file_name_without_css_extension
Im looking for a way to compile all of my coffeescript files, currently in individual files such as features.coffee // scroll.coffee etc etc, in to one main outputed .js file.
Im using an application.coffee file at current to act as the main file. Ive imported my various files using:
#= require features.coffee
#= require scroll.coffee
However when Im outputting the application.coffee to application.js on the code from within the application.coffee is outputting and not that of the imported files
Im assuming that coffeescript imports are not native features and that some sort of plugin will be needed
Thanks in advance
You have to manually merge the source files into a main script file ( aka concatenate them ), then compile to JavaScript. You have not specified what you are working with, but in node.js, the require function only executes an external script ( to put it very simply ), it does not place the source code into current file as you seem to be expecting.
There are many tools on the network to concatenate your source code into a single main script - just google around and find what suits you best.
I am reading a book for "Ruby on Rails". In the "application.js", we are including other JavaScript libraries in the following way and more specific - jQuery UI:
//= require jquery
//= require jquery_ujs
//= require jquery-ui
As this is ordinary JavaScript file (not ruby extensions here like "html.erb" for exmaple) how the application knows to execute the require command? What kind of JavaScript syntax is this:
//=
and as this is ordinary JavaScript file, why we are not using "script" tags to include JavaScript files?
Also, I have read here that "require" method will check for this library in define by $LOAD_PATH variable folders. How can I see where the "jquery-ui" is stored? I am asking because in other applications in order to use jQuery UI I should add not only JavaScript file, but css file and images used by the library - in this case, we are doing this only with single line?
What kind of JavaScript syntax is this.
Anything starting with a // is a Javascript comment.
How is it able to process it ?
Sprockets on the server side scans the JS file for directives. //= is a special Sprocket directive. When it encounters that directive it asks the Directive Processor to process the command, require in this example. In the absence of Sprockets the //= require .. line would be a simple JS comment.
Ruby require vs Sprockets require
These are two completely different things. The one you link to is Ruby's require.
Why not use script tags to load JS files.
Usually, you want to concatenate all your app JS files and then minify them into 1 master JS file and then include that. I recommend reading the YSlow best practices on this.
I also recommend watching the Railscasts on Asset Pipline - http://railscasts.com/episodes/279-understanding-the-asset-pipeline
Cheers!
This will sound like a stupid question for most but I'm really having problems with adding JavaScript files (such as jquery) to my application.html.erb, if I have the jquery first then the rails JavaScript doesn't work correctly. what's the best way to include all JavaScript files to the application.html.erb from my JavaScript folder?
Edit: how can I have Jquery and Prototype run side by said in my rails 3 application? what should my application.html.erb code look like?
If you want to use jQuery and Prototype side-by-side, you should order your javascript include statements as follows:
<%= javascript_include_tag :defaults, "jquery.min", "jquery-ui.min" %>
<script type="text/javascript">
jQuery.noConflict();
</script>
Note: After doing this, you will not be able to access any jQuery methods using $(...). Instead, you'll need to use jQuery(...)
However, if you don't need Prototype, delete your prototype.js file and install the proper jQuery-specific rails.js file (the one that Rails uses by default is Prototype-specific). See https://github.com/rails/jquery-ujs for instructions.
Create new project skip prototype with -J:
rails new -J test -d mysql
Modify the Gemfile, add JQuery:
gem 'jquery-rails'
Bundle update:
bundle update rails
Generator the JQuery, --ui means withe JQuery UI:
rails generate jquery:install --ui
Modify the config/application.rb:
config.action_view.javascript_expansions[:defaults] = %w(jquery jquery-ui rails application)