Vue.js 项目build后路径问题

执行npm run build 后再打开index.html发现引用的css和js出现了路径找不到的问题。
打开config/index.js
找到build：

module.exports = {      build: {        env: require('./prod.env'),        index: path.resolve(__dirname, '../dist/index.html'),        assetsRoot: path.resolve(__dirname, '../dist'),        assetsSubDirectory: 'static',        assetsPublicPath: '/',        productionSourceMap: true,        // Gzip off by default as many popular static hosts such as        // Surge or Netlify already gzip all static assets for you.        // Before setting to `true`, make sure to:        // npm install --save-dev compression-webpack-plugin        productionGzip: false,        productionGzipExtensions: ['js', 'css'],        // Run the build command with an extra argument to        // View the bundle analyzer report after build finishes:        // `npm run build --report`        // Set to `true` or `false` to always turn it on or off        bundleAnalyzerReport: process.env.npm_config_report      },      dev: {           ...      }    }

把 assetsPublicPath : ‘/’ 改成 assetsPublicPath : ”

图片路径问题

在项目中遇到需要动态的改变图片路径，图片路径并非是从后台获取过来的数据。
因此在data中必须用require加载，否则会当成字符串来处理。

<script>    export default{    name: 'msg',    mounted () {    },    data () {      return {          listdata: [            {title: '标题文字1', link: '/', head: require('../assets/head.jpg')},            {title: '标题文字2', link: '/', head: require('../assets/head2.jpg')}          ]      }    }  }</script>