vue项目打包后css背景图片无法显示问题

博主在测试打包项目时发现自己使用的404页面的背景图片无法显示，经过之前的问题，基本推断又是路径问题。在搜索引擎一番查找后发现果然是路径的问题，因为打包后的css文件在static文件夹下的css文件夹中，static文件夹和index.html是同级关系，这样引用时的路径就不对了，下面上解决办法：
在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: '../../' //添加了这行代码
		})
	} else {
	return ['vue-style-loader'].concat(loaders)
}

这样就在打包时在css对应引用路径前加入了../../，这样路径就是从当前路径的父级目录的父级目录开始，就可以成功找到css文件资源了。

这里还有一个问题需要注意，在代码中尽量使用相对路径引用，不然即使照上面的方法改过之后路径也是不对的，如我的代码中引用一样：

.not-found {
  height: 100%;
  width: 100%;
  background: url("../../../static/gif/404.gif");
  background-size: 100% 100%;
}

这样css的图片引用路径就没有问题，可以正常显示了。