I'm using Vuejs in a new project and I've added some images to the assets folder. I need an image to be referenceable also in public/index.html, but when I build the project the resulting filename includes an hash.
For instance I've src/assets/logo.svg and after build I've dist/img/logo.e80b121e.svg, but I want dist/img/logo.svg
Is there a way to remove the hash only for a specific file? I need the hash in the other assets. I'm configuring webpack with vue.config.js.
If you're using the webpack config vue cli generated four you if you move your asset in the static folder it will not get the hash.
Items from assets are getting hashed.
<base href="<%= BASE_URL %>"> in index.html, putting the file in the /public/ folder and replacing the image path with ./logo.svg in the componentsYou need to get out the assets files from the entry, assuming that you has chunckhash configured (something like this: output: {filename: "[name].[chunkhash].js"}). You could copy directly from source and add the assets to index.html using some of this webpack plugins:
example:
plugins: [ new HtmlWebpackExternalsPlugin({ externals: [ { module: "@fortawesome/fontawesome-pro", entry: "css/all.css", }, ], }), new CopyWebpackPlugin([ { from: "./node_modules/@fortawesome/fontawesome-pro/webfonts", to: "./vendor/@fortawesome/fontawesome-pro/webfonts/", }, ]), ] 
CopyWebpackPlugin and now there are both logo.cd5607bc.svg and logo.svg, how can I have only logo.svg?
entry ;)