NuxtJS Changes assets file names in production

user_6246920 0
Viewed 2578

I'm new to VueJS, NuxtJS, Webpack. Currently using NuxtJS for a static site, its going good till now. The only thing that worries me is that the file names is assets folder gets change to some hash after build. For example:

~/assets/images/image.png

Changes to:

/_nuxt/img/1e88315.png

Is their anyway we can use same image name or image name with hash like: /_nuxt/img/image-1e88315.png

Also, is their anyway we can change _nuxt folder name to something else?

Thanks!

nuxt.js vue.js webpack
1 Answers

You can change this in nuxt.config.js by fileNames options.

By default it is:

{
  app: ({ isDev }) => isDev ? '[name].js' : '[contenthash].js',
  chunk: ({ isDev }) => isDev ? '[name].js' : '[contenthash].js',
  css: ({ isDev }) => isDev ? '[name].css' : '[contenthash].css',
  img: ({ isDev }) => isDev ? '[path][name].[ext]' : 'img/[contenthash:7].[ext]',
  font: ({ isDev }) => isDev ? '[path][name].[ext]' : 'fonts/[contenthash:7].[ext]',
  video: ({ isDev }) => isDev ? '[path][name].[ext]' : 'videos/[contenthash:7].[ext]'
}

Docs: https://nuxtjs.org/api/configuration-build/#filenames

So in in Your case it would be (if You wanna keep names in production):

build: {
    filenames: {
      img: 'img/[name]-[contenthash:7].[ext]'
    }
}
user_105857730
Related