VUE项目常见的技巧总计

1、修改绝对路径为相对路径

打开config/index.js,在build中添写如下代码：

assetsRoot: path.resolve(__dirname, '../dist'),
assetsSubDirectory: './static',
assetsPublicPath: './', 

2. 解决跨域问题(使用代理proxy)

打开config/index.js,在proxyTable中添写如下代码：

'/api': {  //使用"/api"来代替"http://f.apiplus.c" 
        target: 'http://192.168.1.247:51001', //源地址 
        changeOrigin: true, //改变源 
        pathRewrite: { 
          '^/api': '' //路径重写 
          } 
} 

3.CSS背景图不显示问题

（本地开发调试没问题，发布后，CSS背景图不显示。）
打开build下的utils.js文件，添加代码：

// Extract CSS when that option is specified
    // (which is the case during production build)
    if (options.extract) {
      return ExtractTextPlugin.extract({
        use: loaders,
        fallback: 'vue-style-loader',
        publicPath:'../../' //20201110，解决CSS背景图片问题
      })
    } else {
      return ['vue-style-loader'].concat(loaders)
    }

4. vue项目IE中访问为空白页面

（原因是使用VUEX），解决：
1）cnpm install --save babel-polyfill
2）在build》webpack.base.conf.js文件中，添加’babel-polyfill’: ‘babel-polyfill’,

entry: {
    // 在IE中使用VUEX
    'babel-polyfill': 'babel-polyfill',
    app: './src/main.js'
}

本文地址：https://blog.csdn.net/Love_yl/article/details/109647545