vue cli项目，build后图片路径的问题？

Question

1、使用vue init webpack-simple构建了项目，目录结构如下图

2、在vue的组件中
<img src="/static/clinicpackage/clinicbanner.jpg" alt="">
引入图片
3、项目部署后，由于项目使放在域名http···.com/static下面，图片的路径就错了，请问怎么解决？

Answer 1

assetsPublicPath: './'

Answer 2

assetsPublicPath: './'

utils.js

if (options.extract) {
      return ExtractTextPlugin.extract({
        use: loaders,
        fallback: 'vue-style-loader',
        publicPath:'../../'
      })
    } else {
      return ['vue-style-loader'].concat(loaders)
    }

webpack.base.conf

{
   test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
   loader: 'url-loader',
   options: {
     limit: 10000,
     name: utils.assetsPath('img/[name].[hash:7].[ext]'),
     outputPath: process.env.NODE_ENV === 'production' ? '../' : ''
  }
},

Answer 3

可以看看web pack 怎么配置 可以把图片物理上消失，打包成bace64 还可以减少连接次数哦