I have this stock rails 3.1 app, before even adding anything, I was testing to see if the assets are working as advertised
so i created this app/assets/javascripts/test.coffee
where test.coffee is just a
alert "hi"
When I navigate to http://127.0.0.1:3000/assets/test.coffee, I do see
(function() {
alert("hi");
}).call(this);
But if I do http://127.0.0.1:3000/assets/test.js, I get routing error; but I thought this is the correct behavior, not the above one. What have I done wrong?
Try renaming your your js file to test.js.coffee
Coffee extension indicates that this file should be preprocessed with coffee processor, same as:
index.html.haml is just index.html with haml processor or
style.css.sass is just style.css with sass processor
Related
I have added config.assets.prefix = "/endpoint" into my application config. It changes all of the asset locations correctly.
However when I compile with rake assets:precompile the compiled Javascript still does AJAX requests to "/assets" rather than the new "/endpoint".
What am I missing?
Is there any way to make sure everything is calling from "/endpoint" rather than "/assets"?
So asset_path was not working normally. I am using Rails 4.. the following are in scss files. When they compile you see an error being thrown from application.js.
$assets-action-buttons_svg: url("<%= asset_path 'thing.svg' %>");
Does not work. 404 not found.
$assets-action-buttons_svg: url("/endpoint/thing.svg");
Does work.
The Javascripts in general are at /endpoint but there are a few AJAX requests that are hardcoded to /assets within the JS files. Clearing both of these issues resolved it.
I am trying to use a plugin called Shuffletext to give my text a shuffling effect that iterates through different strings. this is the code for it (just have it in the .erb file while trying to get it how to work cause its easier)
<div id="wrapper"></div>
<script type="text/javascript">
$('#wrapper').ShuffleText([
'Hello world !',
"I'm a jquery plugin",
"I like to <strong>shuffle text</strong> !"
],{loop: true, delay: 5000, shuffleSpeed: 50});
</script>
In a simple folder that just has a .html file and the plugin file it works fine, but when I put it into ruby it throws me this error
home:24 Uncaught TypeError: $(...).ShuffleText is not a function
at home:24
I've been trying for a few hours to try and fix this and I am stumped, any help is really appreciated, here is a link to the plugin if it helps
https://github.com/Nyl000/ShuffleText
I suppose, you didn't plug in this library correctly. I didn't find a gem that integrates this plugin into Rails asset pipeline, so you should put plugin file into vendor/assets/javascripts directory. Just copy shuffletext.jquery.js to this folder.
Then you can either add //= require shuffletext.jquery.js to manifest file (usually it's app/assets/javascripts/application.js) after jQuery, or manually add javascript_include_tag 'shuffletext.jquery' to required pages.
If you decided to require plugin in manifest, you can use it on every page where the manifest is plugged. Usually it is plugged in layout, so all pages that use this layout will have it.
If you decided to use javascript_include_tag, you also should add Rails.application.config.assets.precompile += %w( shuffletext.jquery.js ) to your config/initializers/assets.rb file. In this case you will get your plugin only on those pages where you have specified javascript_include_tag.
I have a working edit view to which I'm trying to add CKEditor. I've downloaded the CKEditor folder/files and placed them in my_app/vendor/assets/ckeditor/. I'm using Rails 4 and this folder is included in the asset pipeline. To application.js I've added //= require ckeditor.js and to application.css #import "contents";.
In my edit view I have (I'd like to use the inline option):
<%= f.text_area :page, contenteditable: 'true' %>
<script>
CKEDITOR.disableAutoInline = true;
CKEDITOR.inline( 'image_page' );
</script>
Problem: Now when loading the edit view, the text field is not displayed as an editable field but just as plain text. There's no way to edit this text and no sign of CKEditor. Any idea what I'm doing wrong?
The page's source code that is being generated, includes:
<textarea contenteditable="true" name="image[page]" id="image_page">
Arbor cubo vel.
</textarea>
<script>
CKEDITOR.disableAutoInline = true;
CKEDITOR.inline( 'image_page' );
</script>
Update: I got it working by moving the CKEditor files from the vendor folder to the public folder. Could someone perhaps confirm whether or not CKEditor is compatible with the asset pipeline?
I would prefer to place it in the vendor folder if anyway possible. This old post as well as this one refer to something similar (if I place <% var CKEDITOR_BASEPATH = '/ckeditor/'; %> as a header line in application.html.erb my app crashes with the error dynamic constant assignment '.freeze). Could someone with more experience with CKEditor provide a more definitive answer than these old posts?
Try adding the ckeditor assets under either vendor/assets/javascripts for the JavaScript files and vendor/assets/stylesheets for the CSS files (separate the ckeditor assets among those folders)
The whenever an asset is referring to another asset use the asset-url helper instead of url so that this asset is served through the asset pipeline
You also need to include all the assets that you'll put in vendor.... folders in the asset pipeline by //require or import
On a side not you can use the ckeditor gem https://github.com/galetahub/ckeditor it will save you a lot of time also it handles some features out of the box like images upload and gallery of ckeditor
May be the script is executing before the textarea is fully loaded on the DOM. Try to use a post load wrapper to your script like the jquery's:
$(function(){
// ... your code
})
I have a file called myjavascript.js.erb in my assets path. This is where I put all my project related javascript etc.
As I understand it, rails runs this file through the erb interpreter first and then loads the resulting JS file.
I have the following line in my file
console.log( "<%= root_path %>" );
I was hoping that this would log the root path of the project but unfortunately it seems to only get me
"/path to rails project omitted/app/assets/javascripts"
Surely this should point to the root of my project? Am I doing something wrong?
You can use
Rails.root
To get to the root path in Rails.
How do I use CSS with RoR? When I link externally, I'm never able to see the files. I cp'd the .css file to every folder I could think of...views, controller, template, and nothing seems to work.
What do I need to do to enable external CSS files with a rails application? I'm new to rails, so forgive me if this is basic.
Put the CSS files in public/stylesheets and then use:
<%= stylesheet_link_tag "filename" %>
to link to the stylesheet in your layouts or erb files in your views.
Similarly you put images in public/images and javascript files in public/javascripts.
If you are using rails > 3 version, then there is a concept called asset pipeline. You could add your CSS to
app/assets/stylesheets
then it will automatically be picked up by the app. (this is useful as rails will automatically compress the CSS files)
read more here about the asset pipeline
Use the rails style sheet tag to link your main.css like this
<%= stylesheet_link_tag "main" %>
Go to
config/initializers/assets.rb
Once inside the assets.rb add the following code snippet just below the Rails.application.config.assets.version = '1.0'
Rails.application.config.assets.version = '1.0'
Rails.application.config.assets.precompile += %w( main.css )
Restart your server.
I did the following...
place your css file in the app/assets/stylesheets folder.
Add the stylesheet link <%= stylesheet_link_tag "filename" %> in your default layouts file (most likely application.html.erb)
I recommend this over using your public folder. You can also reference the stylesheet inline, such as in your index page.
The original post might have been true back in 2009, but now it is actually incorrect now, and no linking is even required for the stylesheet as I see mentioned in some of the other responses. Rails will now do this for you by default.
Place any new sheet .css (or other) in app/assets/stylesheets
Test your server with rails-root/scripts/rails server and you'll see the link is added by rails itself.
You can test this with a path in your browser like testserverpath:3000/assets/filename_to_test.css?body=1
To add to the above, the most obvious place to add stylesheet_link_tag is in your global application layout - application.html.erb.
With Rails 6.0.0, create your "stylesheet.css" stylesheet at app/assets/stylesheets.
Have you tried putting it in your public folder? Whenever I have images or the like that I need to reference externally, I put it all there.