vue-cli webpack打包后加载资源的路径问题

vue项目，访问打包后的项目，页面空白。这时会有两类问题，都是路径问题。

1.css,js等文件无法加载，是目录里少了dist

打开页面时一片空白

解决：

config/index.js文件的build->assetsPublicPath的默认值改为 './'

assetsPublicPath：资源的根目录。这个是通过http服务器运行的url路径。

  build: {
    // Template for index.html
    index: path.resolve(__dirname, '../dist/index.html'),

    // Paths
    assetsRoot: path.resolve(__dirname, '../dist'),
    assetsSubDirectory: 'static',
    assetsPublicPath: './',												<-----------这里改为./

    /**
     * Source Maps
     */

    productionSourceMap: true,
    devtool: '#source-map',
    productionGzip: false,
    productionGzipExtensions: ['js', 'css'],
    bundleAnalyzerReport: process.env.npm_config_report
  }
}

2.加载不到图片

解决：

build/utils.js文件的ExtractTextPlugin.extract新增 publicPath:"../../"

  function generateLoaders(loader, loaderOptions) {
    const loaders = options.usePostCSS ? [cssLoader, postcssLoader] : [cssLoader]
	...

    // 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)
    }
  }