[Vue warn]: $attrs is readonly.[Vue warn]: $listeners is readonly.重复引用Vue

今天用Vant组件库写了一个放大展示图片的效果出了这样几个报错:

原因:

重复引入 Vue

需要在Vue.config.js文件上配置:

const path = require('path')
function resolve(dir) {
  return path.join(__dirname, dir)
}

const { defineConfig } = require('@vue/cli-service')
module.exports = defineConfig({
  transpileDependencies: true,
  // 反向代理
  devServer: {
    port: 8888,
    proxy: {
      '/chl': {
        target: 'https://v2.api-m.com',
        changeOrigin: true,
        // pathRewrite 路径重写
        pathRewrite: {
          '/chl': ''
        }
      }
    }
  },
  //解决报错 点击展示图片报错
  chainWebpack: (config) => {
    config.resolve.alias.set('@', resolve('src')).set('vue', resolve('./node_modules/vue'))
  }
})

完美解决!!!