How to set versions of chunks in vue?

Question

Vue.js

Colleagues, welcome.
How to set versions of chunks in vue?

for example

http://127.0.0.1:3000/js/lang-ru-main-json.js?v=1
http://127.0.0.1:3000/js/lang-ru-main-json.js?v=2

Or

http://127.0.0.1:3000/js/lang-ru-main-json-v0.0.1.js
http://127.0.0.1:3000/js/lang-ru-main-json-v0.0.2.js

vue.config.js

// eslint-disable-next-line @typescript-eslint/no-var-requires
const ForkTsCheckerWebpackPlugin = require('fork-ts-checker-webpack-plugin')

module.exports = {
  devServer: {
    host: '0.0.0.0',
    public: '0.0.0.0:3000',
    disableHostCheck: true
  },

  parallel: 4,

  transpileDependencies: [
    'vuetify'
  ],

  productionSourceMap: false,
  filenameHashing: true,

  pluginOptions: {
    webpackBundleAnalyzer: {
      openAnalyzer: true
    }
  },

  chainWebpack: config => {
    config.plugins.delete('prefetch')

    config.plugin('VuetifyLoaderPlugin').tap(args => [{
      match (originalTag, { kebabTag, camelTag, path, component }) {
        if (kebabTag.startsWith('core-')) {
          return [camelTag, `import ${camelTag} from '@/components/core/${camelTag.substring(4)}.vue'`]
        }
      }
    }])
    config.module
      .rule('i18n')
      .resourceQuery(/blockType=i18n/)
      .type('javascript/auto')
      .use('i18n')
      .loader('@kazupon/vue-i18n-loader')
  },
  configureWebpack: config => {
    // remove the existing ForkTsCheckerWebpackPlugin
    config.plugins = config.plugins.filter(
      p => !(p instanceof ForkTsCheckerWebpackPlugin)
    )
  }
}

Browser caches, users get angry.

Vue 2
SPA

Thank you

Answer 1

in the webpack config in the output block:filename: '[name].[contenthash].js',

Answer 2

On our project it is written like this, but using Laravel Mix.

mix.webpackConfig({
    output:{
        chunkFilename:'js/vuejs_code_split/[name].js?id=[chunkhash]',
    },
});

In fact, it doesn’t play a special role, just google the chunkFilename property in the webpack dock.