前言
今天把自己写的demo登录写完了,就想着试着走一下部署上线的流程。参考了很多的文档,终于成功进行了部署。在这里将服务器的搭建和vue项目的
部署上线进行整理(都是基础的知识,希望对大家有帮助。对我帮助是很大的)
2.流程
1.服务器搭建
这里我用的是腾讯云的服务器。买了一个域名。没有备案的域名也可以使用。买完服务器进行域名解析。
点击添加解析,按照下面这样填写就行 马赛克是你的外网ip
可以根据你需要的进行修改,我这只是最基本的绑定。其他请自行百度。
3.添加ssh密钥
第一步添加密钥,会让你下载一个文件到本地(勿删,登录xsheel和xftp用到)然后进行绑定主机(主机需要在关机的状态下进行绑定)
4.安全组(这个貌似没有关系,因为我不记得我安全组是不是自己设置的 也没有百度 我点开安全组就有一条记录在了。。如果在服务器搭建过程中有问题,可以百度这方面的只是。看是不是这里的问题,因为我没在这出现过问题 我也不好说。。)
5.登录xshell6和xftp6
xshell6:搭建服务器的时候需要的终端管理系统 xftp这里的作用是有的时候需要你在自己的系统下载linux 需要的压缩包 然后传输到linux系统中。可以借助xftp
xshell6登录 主机为你的外网ip
用户名一般都是root 密码由于我们之前设置了密钥 所以使用密钥登录,浏览选中之前设置密钥让你下载的密钥文件 导入即可。点击确定就登录成功了
xftp的登录一样
6.安装jdk
7.tomcat 安装
tomcat 和 jdk的安装我就是按照上面的文档进行安装了,所以大家访问人家的博客就可以了。
8.mysql 安装
上面这四行为初始化信息后的提示信息,不用管他 这样就算是初始化信息成功了
远程管理数据库
使用dbvisualizer链接服务器上的mysql数据库的时候,会报错 ‘你的服务器ip' is not allowed to connect to this MySQL server
解决方法:
重新远程连接即可。
使用dbvisualizer连接成功后,点击数据库任意位置,报错
查看了百度都说是表或者字段的问题,但是我没有点击表操作啊。后来换了10的版本 dbvisualizer 就可以使用了。。之前使用的是8版本的 我怀疑是mysql 驱动jar包的问题。问题解决了我就没去管了。 这样mysql 就解决了 下面就打包后台代码上传tomcat进行访问
9.打包后台代码
右击后台项目 export ---->MyEclipse JEE ------>WAR file
选择本地保存路径 finish打包。通过xftp将本地的war包上传到服务器的
上传到webapps目录就行了,然后使用tomcat访问这个项目,tomcat会自动解压的
进入 /usr/local/tomcat/tomcat7/logs
tail -f catalina.out //查看日志 其他日志命令请自行百度
10.vue项目打包
axios post 请求无法访问后台以及数据无法传输解决
页面使用axios
后端代码
问题解决.
打包路径问题
config文件下的build.js 中的 build 代码块中
在router文件夹下的index.js添加 base '/自定义文件夹名/' 上面import我之前是使用的@ 后来我换成了 ../ 不知道有没有影响,请自己注意下这里
在git bash here 里面
这样就是打包成功,
在tomcat下的这个目录创建一个空目录 名字就叫作你在路由的index.js自定义的那个名字
然后将dist文件下的static文件家和index.html放在这个目录下 访问地址 就可以访问你的项目了 这样一般出现的路径问题就不会出现了 有的时候会出现样式错乱的问题,一般就是你在组件中修改了公共组件的样式 建议自定义样式 或者使用scoped 进行封装。
地址栏刷新 页面404 问题 参见上图 新建WEB-INF文件夹 在里面新增一个web.xml 里面的代码为
在项目中新建此文件,里面内容自己定义。地址栏刷新问题就解决了。
至此,所有的流程就都解决了,这篇博客中基本都是参考别人的博客进行归纳总结的。毕竟也是花了点时间的。希望对大家有所帮助。毕竟流程都走完了 剩下的就是慢慢开发业务了。
总结
以上所述是小编给大家介绍的vue项目部署上线遇到的问题及解决方法,希望对大家有所帮助,如果大家有任何疑问欢迎给我留言,小编会及时回复大家的!
原文链接:https://www.f2er.com/vue/31957.html