Prevent specific css and js file from being cached htacesss - apache

How can i use the htacess from caching my main.css and main.js file. However i use multiple js files and css files like so
css --- main.css dafault.css new.css
js --- main.js acc.jss new.js
what i want to do is prevent the caching of only main.css and main.js how can i do that but the rest of the css files as well as the js files should be cached

Make the script & css references versioned. add a date time string at the end of file extension with ? mark.
Ex:
<script src = "main.js?ver=" + dateTimeNow />

Related

How to rename bundled static files(ProjectName.style.css and blazor.server.js) in The Blazor App

I wanna hide that i use The Blazor.
so, I should modify name of bundled css and js files.
How to do this?
According to this article, CSS isolation occurs at build time. During this process, Blazor rewrites CSS selectors to match markup rendered by the component. These rewritten CSS styles are bundled and produced as a static asset at {PROJECT NAME}.styles.css, where the placeholder {PROJECT NAME} is the referenced package or product name.
That means we could only disable the bundle not modify it during develop environment.
But after publish, it will generate the file like this:
You could modify the {PROJECT NAME}.styles.css to {other}.styles.css and modify the index.html css name as below:
<link href="{other}.styles.css" rel="stylesheet" />

Nuxt SPA with Pre Rendered static content HTML

I'm using nuxt generate --spa to build out my files into my dist folder. It is creating the actual .html files like products/product.html however it is still chunking the files in javascript script tags.
<script type="text/javascript" src="/_nuxt/890d3a2acad1dc557c61.js"></script>
I also have my app set as 'spa' mode in nuxt.config.js
export default {
mode: 'spa',
}
How can I set nuxt to generate the required html files and to acutally generate static .html code in the source code when you view the website in the browser?

Using env variables in public path (not index.html file) in a vue.js project

Is it possible to use env variables inside a .html file (public path) but not the index.html one
i have tried and it works fine in index.html but in any other .html file it doesn't work, for example if write this in img src:
<img src="<%= VUE_APP_API_Base %>/Image" border="0" style="width: 468px; height:60px;">
It doesn't parse anything from the .env files and src is written as it is instead of using the value of env variable. When visiting that html page url encode error is thrown in console.
Structure of my directory is:
public
|-- index.html
`-- sub-folder
`-- sub.html <<<=== This is the file where I want to use .env variable
EDIT: To clarify about duplicate, I am asking specifically how to include a variable from .env file in a non-root html file (index.html), the duplicate asks about using multiple html files with webpack which is a different scenario
Link to Vue.js docs explaining the solution for this problem
The global BASE_URL and NODE_ENV actually works fine but not anything from my .env files.

How to reference `baseUrl` in the `<style>` section of a vue.js SFC?

How may we reference baseUrl in the <style> section of a vue.js SFC?
/src/views/Home.vue
<style scoped>
#import url(<%= BASE_URL %>static/required_styles.css); // does not work
</style>
Directory structure:
|--public
| --static
| --required_styles.css
|--src
| --views
| --Home.vue
It's not clear how to do this from the docs on static asset handling:
https://cli.vuejs.org/guide/html-and-static-assets.html#the-public-folder
The public folder is for files that you want to be served directly on the server without going through webpack. An example would be minified css who's styles you use. In that case you would just add the css path to vue.config.js or the header of index.html. If you are importing in the styles tag the css will be pull through your build process (e.g. webpack) when the component is compiled. This means you should not put the .css file in the public folder, and should use a relative path for the import.

How to include the dijit.css and other related .css files in the dojo build file

I'm trying to create a dojo build file. What do I need to add in the profile.js file to include all the .css files inside the dojo build.js file. I'm getting dijit.js and other .js files, but the dependent .css files are not getting built into the build.js file
I'm using dojo 1.8
It doesn't really make sense to ask to combine JS and CSS into a single file. JavaScript is JavaScript; CSS is CSS.
That said, you should be able to get down to as little as one CSS request by specifying cssOptimize: 'comments' in your build profile, which will strip comments from CSS files within packages the build processes, and flatten imports. As a result, each Dijit theme's main CSS file (e.g. themes/claro/claro.css) will then require only one request, rather than requests for each component.