On my project i have following routes (routes.rb)
resources :main, path: '/' do
collection do
get 'about'
get 'blog'
get 'resources'
get 'contact'
get 'projects-and-tutorials'
end
end
and these routes are loading files from public folder like about.html and contact.html, right now no css file is loaded on these pages.
I have created a css folder under public folder and will load css file from there on these public pages but i am not sure if it is good to go with
how can i load css files from app/assets/stylesheets or there is another way to load css on public files ?
You cannot load the files app/assets/stylesheets(not visible publicly) inside the files in public directory.
You can create a separate directory inside public folder and put your css files there. and then you can refer them directly.
Related
My folder structure of Angular 10 project is given below
-Backend
-e2e
-node_modules
-src
I want to access backend/uploads/profilepic.jpg in the angular's index.html page. Simply, i just want to load an image file in the front end which is uploaded in the backend folders.
A static resource, like an image, is either bundled inside the angular webapp, by adding it to the assets folder (e.g. 'src\assets\images') and have that folder referenced inside angular.json:
"assets": [
"src/assets"
],
Or, make the backend serve that image and simply access it from the frontend like this:
<img alt="xyz" src="https://yourdomain/img_test.png">
If both the backend and frontend are hosted on the same domain, you can use relative path for the URL, i.e https://yourdomain can be omitted.
Finally, I found the solution. In order to access the files of the 'uploads' folder which is located in the backend folder. I have to make that folder static. for that in my server.js file, I have added below code
app.use('*/uploads',express.static('uploads'));
after that, I could load my image file from that uploads folder by calling
http://localhost:8090/uploads/image.jpg
I need to open an static HTML file inside an iframe because I need it to be printed silently, I’m trying setting the iframe src with absolete and relative paths but none of them work, I’ve tried moving my files inside public, static and assets folders with no success, I’ve seen that some people uses process.env.BASE_URL to access absole path of environment but it doesn’t work in Quasar.
Currently I have my files in a folder called ticketTemplates inside public folder placed at root, and it has two files: first.html and first.css, I’m doing the following:
<iframe src="ticketTemplates/first.html" frameborder="1"></iframe>
But as I said before it does not with relative or absolute paths. I've tried with http://localhost:8080/ticketTemplates/first.html too and it does not work.
Could you tell me how to achieve it?
I opened this tread in Quasar Forum and I found I was using an outdated version of #quasar/app, I updated my project and the content worked inside my iframe.
I moved my ticketTemplates folder inside public folder located in root directory, next to quasar.conf.js file and the resulting code was:
<iframe src="http://localhost:8080/ticketTemplates/first.html" frameborder="1"></iframe>
All the credit goes to the user who helped me.
The default directory structure when using vue-cli contains a 'public' directory and 'src' directory. The public directory contains index.html. What exactly is the purpose of putting index.html in the public directory instead of src? What are other examples of files that should go in public?
Files placed in the public folder are static and will not be processed by webpack.
"Placed in the public directory and referenced via absolute paths. These assets will simply be copied and not go through webpack"
Source: https://cli.vuejs.org/guide/html-and-static-assets.html#static-assets-handling
Example may include: Favicon, icons for PWA, robots.txt, manifest.json... Just to name a few.
I'm running Prestashop 1.7.4.0 and have built a custom module for posting comments.
I'm trying to load a css file and a javascript file each time the user visits the product page, where the module is being loaded.
public function hookDisplayProductComments($params) {
//...code
$this->assignProductComments();
return $this->display(__FILE__, 'displayProductTabContent.tpl');
}
In the function assignProductComments() i have:
public function assignProductComments() {
//...code
$this->context->controller->addCSS($this->_path.'views/css/mymodcomments.css');
$this->context->controller->addJS($this->_path.'views/js/mymodcomments.js');
//...code
}
The files are not only not loaded, but there is no trace of them in the page source either.
I mention that:
both of the files have some content in them
The directory structure is: /views/css/mymodcomments.css, and /views/js/mymodcomments.js, in the folder of the module
Either i leave these assets in the directory, or i delete them, the script still doesn't seem to try to load them
I tried:
cleaning the cache
forcing file compilation
uninstalling and reinstalling the module
Alright, so the answer was that the assets (js and css files) need to be loaded in the hookDisplayHeader() function.
So, you have to add a registerHook('displayHeader') in the custom module in install() function, and then uninstall and reinstall the custom module.
I have laravel 5 and config file in the config folder and My css located in the resources folder which is a same level with public folder where located index.php. Virtual Host Apache config looks to the public folder as a root site directory, but in this situation I cannot declare correct path from /public/index.php to the resources folder.
From one side I can try easy way and just relocate public folder into root of the laravel, but I don't like this way, any ideas?
Use resource_path('path/to/your/css')
https://laravel.com/docs/5.3/helpers#method-resource-path
EDIT
The most logical is to include your stylesheets in your public folder though. If you need to style a page, the style is public anyway. So why not put in the public folder. There's 2 options to do this:
Do it manually by just copying/moving the files
Use an automated tool like Gulp or Laravel's own Elixir, which provides a really easy way to copy your assets.
add this code in public/index.php
$app->bind('path.public', function() {
return __DIR__;
});