vue 计算文件hash值

可以使用webpack的file-loader插件来计算文件的hash值，具体步骤如下：

1. 安装file-loader插件

npm install file-loader --save-dev

2. 在vue的webpack配置文件中添加file-loader插件的配置

module.exports = {
  // ...其他配置
  chainWebpack: (config) => {
    config.module
      .rule('images')
      .use('file-loader')
      .loader('file-loader')
      .tap(options => {
        // 修改file-loader的配置，计算文件的hash值
        options.name = '[name].[hash:8].[ext]'
        return options
      })
  }
}

3. 在vue组件中引入文件时，使用相对路径，并且不需要加上文件后缀名

<template>
  <div>
    <img :src="imgUrl">
  </div>
</template>
<script>
export default {
  data () {
    return {
      imgUrl: require('./assets/img/test')
    }
  }
}
</script>

这样，在打包构建时，会自动计算文件的hash值，并将文件名修改为`test.8位hash值.jpg`的形式。