vue cli3.0 打包并在本地查看

根据以下命令对项目进行打包： 

npm run build

 命令执行完出现

 DONE  Build complete. The dist directory is ready to be deployed.
 INFO  Check out deployment instructions at https://cli.vuejs.org/guide/deployment.html

看了一下，build complete,嗯完成了，后面的也没有看，直接打开了生成的dist文件夹下的index.html

打开后出现一个空白页面，并且控制台是上面这样的。 

在网上查了很多，基本都是在config/index.js中改路径。那么问题来了vue cli 3.0没有build和config 啊，那去哪里改?

最后发现直接在根目录下vue.config.js(如果没有这个文件的话，可以直接在更目录中添加一个，配置参考)文件中进行修改。

将baseUrl属性的值'/'改为'./'。

module.exports = {
  // 基本路径
  baseUrl: './',
  // 输出文件目录
  outputDir: 'dist',
  // webpack-dev-server 相关配置
  devServer: {
    port: 8888,
  },
}

改好之后就可以直接在本地打开index.html了。

额。。。打开是打开了 ，可是问题又来了，我的登录页面需要请求cookie，但是在这里get返回的是个空。。。。好像是因为filex协议的问题。并且在部署里（也就是在执行完npm run build 之后提示的连接中）也说明了dist 目录需要启动一个 HTTP 服务器来访问，所以以 file:// 协议直接打开 dist/index.html 是不会工作的。

不知道为什么我运行下面命令不起作用：

npm install -g serve
# -s 参数的意思是将其架设在 Single-Page Application 模式下
# 这个模式会处理即将提到的路由问题
serve -s dist

就在网上查看了一下，我用了其中一种方法（参考）：

执行下面命令：

npm install http-server -g 全局

 然后在dist文件下执行：

http-server

直接打开上面的网址访问就可以了。