I'm converting a static website into a Drupal 8 template and everytime I change something in the stylesheet I have to do 'drush cr'. Is there a better way to do this? I've disabled CSS and JS aggregation and I've followed everything listed on this link https://www.drupal.org/node/2598914.
You need to disable cache
Clearing cache in Drupal 8
Related
I have a very particular question, cause I wish to create a webpage that works without a server, and I'm trying to do it using vite, my whole project is using vue + vite.
if I try to use "vite build" command, the page deploy as blank, and the only way I can see the page is if I use "vite preview".
would it be possible, somehow, to load the content of the html page using vite, without needing the "vite preview"? just double clicking on index.html
Using vue-cli, this is possible by setting the publicPath in the vue.config.js file to an empty string, see: https://cli.vuejs.org/config/#publicpath
I've personally only used it with Vue 2, but from what I read online it should also be possible with Vue 3, if you're okay with switching to vue-cli.
Using Vite, I found this question and answer which shows a way by bundling all the scripts, css and images into a single file:
How to open a static website in localhost but generated with Vite and without running a server?
I did try that and it mostly works, but not currently for svg files which I use a lot of in my application. It might work fine for your use-case.
I did also need to add "type": "module", in my package.json to get rid of an error saying
"Error [ERR_REQUIRE_ESM]: require() of ES Module
/path/to/dist/index.js from /path/to/vite.config.inlined.ts not
supported."
If you open your page simply as an index.html, you will be limited regarding some API calls and alike. Nowadays, you will need a light server to be hosting it via a simple vite preview as you saw. This is mainly because the files are being worked with bundlers like Webpack and Vite.
I'm not sure that there is a way of loading the whole thing with just an index.html because files like .vue are not natively supported, you need a specific loader.
One simple solution would be to use Vue as a CDN, but it will limit your DX experience regarding SFC files, but you will be able to use Vue into a regular index.html file.
PS: your performance will also be worse overall (because of the required network requests).
If you want something really lightweight, you could of course also use petite-vue, maybe more suited towards super simple projects with a tiny need of reactivity.
I still recommend using something like Netlify or Vercel, to host your static site for free + having the whole Vue experience thanks to a server running vite preview for you.
Im trying to upload static files(images and js) from "static" folder. And it works fine for index file and base route localhost:8000/, but if I go to the next route localhost:8000/reviews/master001 then static files disappears and I receive by route localhost:8000/reviews/js. And there is two things, first is how to remove prefix "reviews"?
I tried to use in nuxt.config.js
static: {
prefix: false
}
by documentation, but it does not work. Tried to use paths in nuxt.config like "../js", "#/static/js", "/js" - this one works for index file.
Also there are no any static files after I go through the router-link such it in nuxt documentation for path localhost:8000/reviews/master001.
Here there are.
And here there no any files.
As explained in the comments above, images should be in assets and static is only aimed for specific use cases, like exposing a publicly accessible .pdf file.
If you want to install and use jQuery properly into your Nuxt project, you can follow my answer here: https://stackoverflow.com/a/68414170/8816585
If you want to load a specific script and cannot do it in a more cleaner way (with NPM), you can also follow the instructions there: https://stackoverflow.com/a/67535277/8816585
Use this as a last resort tho and be aware that it will increase bundle size and loading time.
I am currently working with gulp-less workflow with livereload feature of chrome and gulp-livereload is working fine.
When I am making any changes to file, livereload refreshes the css and unfortunately it is injecting livereload css instead of less files.
So I have to refresh the page to show the corresponding less file which is very time consuming and made no use of livereload.
It is totally nonsense to use livereload if I anyhow need to refresh the page to see the less sourcemap files?
Let's say I am generating custom.css file from all the less files but when I change into any partial files, livereload generates sourcemaps and updates custom.css as well in the file system but in browser what I see is only injected css.
See the below screenshot to get the exact issue that I am facing.Note that it also appends some version and port number also after injected css. E.g. css/custom.css?livereload=1577164609829 for my case.
What I am expecting to see on refresh is the corresponding less file in browser and not the injected css through the livereload.
Has anyone faced this issue before? If yes then please help me.
Note: Please don't advice using browser sync or any other instead of livereload.
I am building a very small application that uses everything from CDNs, including Vue.js, so far everything has worked great, but I want to load another CDN now - this one.
I'm used to that via ES6 (and usually Laravel's stuff takes care of that - do I have any way of including the CDN listed on that page and using including it in my code?
Simply including the CDN via script before everything else didn't work.
You can include the script tags in the index.html or any other html which you use to initialize your root vue component.
I have a Phalcon app where I added some HTML (in volt), JS and SCSS. I compiled my CSS into the public directory and my JS files are also there. Everything works. Then I try to change my JS or CSS, but Phalcon ignores all changes. If I delete the files and refresh the page, the page style is gone and when I put them back, the new files effectively show up.
It seems like Phalcon is saving a cached version of my assets, but where? And how do I clear this cache?
We just solved this issue in vagrant by disabling send file support with sendfile off; parameter to nginx site.