一. 配置基础的路径
- vue.config.js用于修改端口号,修改根目录路径,输出目录,静态资源
- 新建文件vue.config.js
- 设置根路径和输出路径,构建的输出路径会展示在目录中
-
baseUrl根路径、outputDir输出目录、assetDir静态资源目录、lintOnSave是否开启eslint保存检测
- open运行之后是否主动跳出页面
- host主机名字,真机测试用0.0.0.0域名,普通用localhost
- port端口号,默认8080
- https,如果为true页面协议前缀由http改为https,并且页面会提示安全性,最好写false
-
hotOnly热模块更新,添加新模块会有更好的配置,false即可
二. 配置跨域请求proxy
- 配置跨域,请求后端接口
- 'api'代替的名字
- target设置跨域地址。协议头,域名和端口号三者中有一个不同,就实现了跨域。目前我们的端口号为8081,所以端口号不同,实现跨域。
- ws设置是否跨域
- changeOrigin配置跨域
-
pathRewrite重新配置名字
三. 加载美团外卖数据json
-
通过app.get对应的地址,获取相应数据。会传过来request和response,res.json返回json数据。只是此时json数据还未配置好
-
在目录文件外面准备了一个data文件,里面有json数据,将其拉到项目内部。并在vue.config.js中引入。