一、项目打包
npm run build
dist文件是打包后的文件
.map文件
项目打包后,代码都是经过压缩加密的,如果运行时报错,输出的错误信息无法准确得知是哪里的代码报错,有了map就可以像未加密的代码一样,准确的输出是哪一行那一列有错
所以该文件如果项目不需要是可以去掉的
vue.config.js配置
productionSourceMap:false
二、购买云服务器
设置安全组:让服务器一些端口号打开
这里教学了xshell的操作
linux
/
根目录
cd root
是家目录
mkdir 文件夹
创建文件夹
三、nginx反向代理
把项目放在服务器上=>/root/jch/www/shangpinhui/dist
- 为什么访问服务器IP地址就可以访问到咱们的项目?
- 项目的数据来源于另一个服务器,那上线的项目怎么从这个服务器拿到数据?
1.xshell进入根目录/etc
2.进入etc目录,这个目录下有一个nginx目录,进入到这个目录【已经安装过nginx:如果没安装过,只有四五个文件】
3.安装nginx:yum install nginx
4.安装完nginx服务器后,你会发现在nginx目录下,多了一个nginx.conf文件,在这个文件中进行配置
5.vim nginx.conf进行编辑,主要添加如下两项
解决第一个问题:
location / {
root /root/jch/ww/shangpinhui/dist; //dist的路径
index index.html;
try_files $uri $uri/ /index.html;
}
解决第二个问题:
location /api {
proxy_pass http://39.98.123.211; //数据的服务器
}
6.跑服务器 serve nginx start