Vue项目的打包

vue项目的打包

更改config文件夹下的index.js里的assetsPublicPath路径    将 “/”  改为  “./”

 build: {
    env: require(‘./prod.env‘),
    index: path.resolve(__dirname, ‘../dist/index.html‘),
    assetsRoot: path.resolve(__dirname, ‘../dist‘),
    assetsSubDirectory: ‘static‘,
    assetsPublicPath: ‘./‘,
    productionSourceMap: true,
    productionGzip: false,
    productionGzipExtensions: [‘js‘, ‘css‘],
    bundleAnalyzerReport: process.env.npm_config_report
  }

1:原本路径是指向根目录,什么是根目录？

根目录:在计算机的文件系统中，根目录指逻辑驱动器的最上一级目录，它是相对子目录来说的；它如同一棵大树的“根”一般，所有的树杈以它为起点，故被命名为根目录。以微软公司开发的Windows操作系统为例：打开我的计算机（计算机），双击C盘就进入C盘的根目录。双击D盘就进入D盘的根目录

• ../ 父级目录
• ./当前目录

2:css背景图片打包找不到的问题？

打包后，不管原先的图片资源在哪里，路径通通变成static/img/xxxx ，若在HTML里的IMG标签的src引入图片，则正常显示，因为路径是从 index.html 开始寻找的，所以static/img/xxxx是能正确访问到图片。

但是在css/app.css里，在当前的CSS目录下，无 static/img 路径，所以资源找不到。而背景图片要回退两级才能正确访问到.

index.html 
      static 
      | --img 
          | --图片.jpg
      | --css 
          | --app.css 
      | --js

| --app.js

解决方法：build->utils.js

原文地址：https://www.cnblogs.com/webworld/p/10704723.html