vue-cli2 打包

npm run build 打包安裝 相當於靜態資源

解決vue-cli項目打包出現空白頁和路徑錯誤的問題

路徑錯誤的問題解決方式：

打開config文件夾下的 index.js 找到如下圖所示區域： 

將build中 assetsPublicPath: '/', 改為 assetsPublicPath: './',

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

    // Paths
    assetsRoot: path.resolve(__dirname, '../dist'),
    assetsSubDirectory: 'static',
    assetsPublicPath: '/',
    productionSourceMap: true,
    devtool: '#source-map',
    productionGzip: false,
    productionGzipExtensions: ['js', 'css'],

    bundleAnalyzerReport: process.env.npm_config_report
  }

頁面空白的問題解決如下：

router-view中的內容顯示不出來。路由history模式。

這個坑是當你使用了路由之后，在沒有后端配合的情況下就手賤打開路由history模式的時候，打包出來的文件也會是一片空白的情況，

很多人踩這個坑的時候花了很多時間，網上的教程基本上都是說的第一個坑，這個坑很少有人提起。

這里並不是不能打開這個模式，這個模式需要后端設置的配合，詳情可以看：路由文檔

內容有了可是本地圖片顯示錯誤：

由此可見導致問題的原因仍然是路徑問題，解決方法如下： 
打開 build 文件夾下的 utils.js 文件，找到以下部分加入publicPath:'../../',即可。如下顯示

if (options.extract) {
      return ExtractTextPlugin.extract({
        use: loaders,
        publicPath:'../../',
        fallback: 'vue-style-loader'
      })
    } else {
      return ['vue-style-loader'].concat(loaders)
    }
  }