DEV Community

Static / Fixed filenames for generated vue-cli builds

Alexandru Bucur on July 04, 2018

As you may know, the release of vue-cli 3 is getting close (currently at RC3 status). I really like the streamlined way of starting projects and h...
Read full post
Collapse
 
drozerah profile image
Drozerah • • Edited

Hi Alexandru !

I'm struggling to figure out how to remove the generated hash on the images files names, not able to find the right syntax into my vue.config.js, any ideas ?

module.exports = {
  chainWebpack: config => {
    config.module
    .rule('images')
    .test(/\.(png|jpe?g|gif|webp)(\?.*)?$/)
    .use('url-loader')
    .loader('url-loader')
    .options({
      name: 'img/[name].[ext]'
    });
  }
}

20 minutes later update

Ok, I got it !

module.exports = {
  chainWebpack: config => {
    config.module
    .rule('images')
    .test(/\.(png|jpe?g|gif|webp)(\?.*)?$/)
    .use('url-loader')
    .loader('file-loader') // not url-loader but file-loader !
    .tap(options => { // not .option() but .tap(options...)
      // modify the options...
      options.name = 'img/[name].[ext]'
      return options
    })
  }
}
Collapse
 
jcarlosweb profile image
Carlos Campos • • Edited

Thank you very much