How do I configure Middleman to build images without appending a hash to the filename? I'm referring to filepaths in javascript and need to know the full filename to refer to the files. My JS doesn't get updated with the hashed filenames like my CSS does.
Oops, figured it out. I had enabled activate :asset_hash. removing that from config.rb fixed it.
No need to abandon :asset_hash just because you want to refer to them in JS. The asset hash extension actually attempts to rewrite paths in CSS and JavaScript automatically, but it sounds like whatever way you're linking them isn't getting detected.
You can always name your javascript something like application.js.erb and then have code like this:
var my_image = <%= image_path("myimage.png") %>;
That way you'll always have the right path.
Related
In my Vue 3 project, all images are located in public/assets/image then in .vue files I refer to these images like assets/image/image.png.
Sometimes I might make a typo in a path or a path might not be correct anymore.
Is there any automated way to find and fix all incorrect paths in a project?
I am using "VS Code" and "IntelliJ IDEA" might be there are any plugins to handle this.
In VS Code there is an extension called Image preview
https://marketplace.visualstudio.com/items?itemName=kisstkondoros.vscode-gutter-preview
If the path is right it shows the image at the left side of the import.
I'm changing background image on hover.
The code for image url looks like this:
background-image: url('../assets/img/project1.png');
But when I look in the Chrome inspector it looks like this:
background-image: url(/img/project1.9fba20d0.png);
So when I try to change image need that code (9fba20d0) for it to work.
Why dose '9fba20d0' appear? How do I remove it or get it without hardcoding it?
I actually haven't used Vue.js, but I'm sure the random string appended to end of filename is for "cache busting" purposes.
Basically, the string changes each time you build your application so the next time you request index.html from the server it will reference the new filename (with a different random string at the end). If there was no string, the browser would look locally to find the file, which may be an outdated version, if you've made changes since last rebuild.
I'd try and understand how Vue.js is creating your production "assets", i.e. all the images and other static files and see if you have some options to change the default behavior, if need be. Might have to read the documentation pertaining to caching.
Hope that at least points you in the right direction!
I'm upgrading an old Rails 2.3 (I know, I know) which uses an external program to modify a PDF before rendering it for an action. Therefore, it's necessary for the action to be able to determine the filename of the PDF source file, which is stored in the view template directory, which was done with:
view_paths.find_template(default_template_name(:show), :pdf).filename
However, this no longer works in Rails 3. I've tried something like:
lookup_context.find :show, controller_name
But I can't find a way to specify the format, so that always returns the path for the HTML template (app/views/name/show.html.erb). How can I get the filename of the template for the PDF format (app/views/name/show.pdf)?
Though more complicated than I would like, I eventually found this, which seems to work:
ActionView::LookupContext.
new(view_paths, {formats: :pdf}).
find(:show, controller_name).
identifier
So we're trying to change the default cluster icon using gmaps for rails.
In the wiki
it says
You can customize the pics used by the clusterer by setting the Gmaps.map.customClusterer js function in your code.
Where would we put that function? It says "In the javascript" - but where? Do we straight-up edit the code generated by gmaps4rails? How does gmaps4rails pick up the information?
To do this customization you just need to create js file. Then you can
"require" that js file in your Application.js or otherwise just directly refer in your view file. That's it you need not to do anything else. I have used it and it worked for me. If any questions do let me know.
To understand how it works you can just refer the
gmaps4rails.base.js (see #customClusterer = -> false)
gmaps4rails.googlemaps.js (method - createClusterer)
it is straight forward to understand
From this page,
http://www.yiiframework.com/wiki/23/how-to-create-a-breadcrumb-widget/
It seems it suggests that we should put the files in the component folder. But if my widget contains javascript and css files, where should these files be placed?
By the way, is this a good idea that I create it as an extension? If I go this way, all widget files are more self-contained in a folder inside the extension folder. But since the widget I am going to work on is very customized, it's unlikely that it will be useful to other people or my other projects. Making it an extension seems a little bit strange.
I understand that it does not really matter where I put these files as long as the paths I am using in the codes are correct but I would like to know the common practice.
I think the common practice is to put the widget in extensions folder with js & css files in an folder named asset. In the php class file, you do initialization first by publishing the asset with yii asset manager.
The file structure may be like
extensions/
widget_name/
widget.class.php
assets/
plugin.js
style.css
I would join the recommendation to put the widget under /protected/extensions.
I put the assets in a slightly more detailed manner: /protected/extensions/WidgetClassName/assets/ and the widget view files in /protected/extensions/WidgetClassName/views/...
Don't forget to edit your /protected/config/main.php and add a row in the 'import' section (for autoloading of the widget): 'ext.WidgetClassName.WidgetClassName.*'