把vue-router和express项目部署到服务器的方法


Posted in Javascript onFebruary 21, 2018

- 首先确定此项目在本地能够运行成功

在本地命令行中输入npm run start,无报错,且打开127.0.0.1:3000

有写的路由为/的页面,如图

把vue-router和express项目部署到服务器的方法

此为文件层级关系

front为前端文件

xk3为后台express与数据库mysql链接的文件

用命令行进入后台并且运行,启动成功

把vue-router和express项目部署到服务器的方法

这是路径为/的页面

把vue-router和express项目部署到服务器的方法

在浏览器中输入路径http://localhost:3000/

浏览器中显示WelCome to express

至此此项目在本地运行成功,我们现在就要放到服务器上。

- 准备工作

此前服务器的基本设置就不再赘述。

打开xftp或者其他类似软件,将此项目全部复制到/var/www/路径下

(此路径可能会不一样,就是服务器网页的路径)

把vue-router和express项目部署到服务器的方法

将后台所需要的数据导入服务器的数据库中,命令为mysql>source “路径”;

然后打开xshell并进入此项目后台,类似于在本地运行后台文件,前提是你的服务器上安装了node,mysql等基本配置,自行百度,还有一个问题就是确定你的vue-router中的路由获取的是服务器的ip+port+router,例如var url = ‘http://47.95.7.109:3000/course/batchDelete‘,还要从阿里云的安全组配置那里打开你的3000端口,不然访问会被阻止。

把vue-router和express项目部署到服务器的方法

我的运行失败是因为我之后用了forever守护进程,一直在占用3000端口,所以无法启动,如果没有设置过的话能够正常启动就和在本地一样。

以我的学生选课系统为例截图

把vue-router和express项目部署到服务器的方法

但是这样你的服务器就一直处于阻塞状态,只要断开链接,服务也会中断。

创建守护进程

接下来就是用pm2或者forever创建守护进程,经过亲测,感觉forever比较简单,只需要几行命令,并不需要额外配置。

即开始使用forever

1.sudo npm install forever -g

2.forever start app.js

3.forever start -l forever.log app.js

这是我出现了一个错误,是没有指定错误和输出的日志文件

提示错误为:log file /root/.forever/forever.log exists. Use the -a or ?append option to append log.

4.解决方案

forever start -a -l forever.log -o out.log -e err.log app.js(app.js就是后台的入口文件)

如果还是不行可使用

forever start -a -l forever.log -o out.log -e err.log ./bin/www

此时node项目部署完成,就算关闭服务器的后台服务也能正常运行,不需要阻塞。

运行成功图片

把vue-router和express项目部署到服务器的方法

如果其中有问题,请提出,谢谢!

样本链接:http://47.95.7.109/student/work/front/#/

以上这篇把vue-router和express项目部署到服务器的方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
ie和firefox不兼容的解决方法集合
Apr 28 Javascript
jQuery旋转插件—rotate支持(ie/Firefox/SafariOpera/Chrome)
Jan 16 Javascript
js 编码转换 gb2312 和 utf8 互转的2种方法
Aug 07 Javascript
JavaScript中实现sprintf、printf函数
Jan 27 Javascript
HTML5使用DeviceOrientation实现摇一摇功能
Jun 05 Javascript
jquery动画效果学习笔记(8种效果)
Nov 13 Javascript
值得分享和收藏的Bootstrap学习教程
May 12 Javascript
JavaScript代码性能优化总结篇
May 15 Javascript
又一款js时钟!transform实现时钟效果
Aug 15 Javascript
Vue结合原生js实现自定义组件自动生成示例
Jan 21 Javascript
vue实现计步器功能
Nov 01 Javascript
vant实现购物车功能
Jun 29 Javascript
浅谈在vue中用webpack打包之后运行文件的问题以及相关配置方法
Feb 21 #Javascript
浅谈webpack打包过程中因为图片的路径导致的问题
Feb 21 #Javascript
解决vue打包之后静态资源图片失效的问题
Feb 21 #Javascript
Vue项目中设置背景图片方法
Feb 21 #Javascript
使用vue + less 实现简单换肤功能的示例
Feb 21 #Javascript
利用angular、react和vue实现相同的面试题组件
Feb 19 #Javascript
jQuery实现滚动到底部时自动加载更多的方法示例
Feb 18 #jQuery
You might like
一个简单的自动发送邮件系统(三)
2006/10/09 PHP
实用函数9
2007/11/08 PHP
php REMOTE_ADDR之获取访客IP的代码
2008/04/22 PHP
php curl 登录163邮箱并抓取邮箱好友列表的代码(经测试)
2011/04/07 PHP
PHP通过正则表达式下载图片到本地的实现代码
2011/09/19 PHP
php curl模拟post请求小实例
2013/11/13 PHP
关于document.cookie的使用javascript
2008/04/11 Javascript
Jquery在指定DIV加载HTML示例代码
2014/02/17 Javascript
jquery调取json数据实现省市级联的方法
2015/01/29 Javascript
js实现网页收藏功能
2015/12/17 Javascript
深入解析桶排序算法及Node.js上JavaScript的代码实现
2016/07/06 Javascript
如何用JS判断两个数字的大小
2016/07/21 Javascript
BootStrap select2 动态改变值的方法
2017/02/10 Javascript
jQuery动态添加元素无法触发绑定事件的解决方法分析
2018/01/02 jQuery
微信小程序使用websocket通讯的demo,含前后端代码,亲测可用
2019/05/22 Javascript
Vue3新特性之在Composition API中使用CSS Modules
2020/07/13 Javascript
在vue中嵌入外部网站的实现
2020/11/13 Javascript
[19:54]夜魇凡尔赛茶话会 第一期02:看图识人
2021/03/11 DOTA
在Python中使用NLTK库实现对词干的提取的教程
2015/04/08 Python
Python中在for循环中嵌套使用if和else语句的技巧
2016/06/20 Python
python使用正则表达式的search()函数实现指定位置搜索功能
2017/11/10 Python
python os用法总结
2018/06/08 Python
python实现批量解析邮件并下载附件
2018/06/19 Python
Python SQL查询并生成json文件操作示例
2018/08/17 Python
python梯度下降法的简单示例
2018/08/31 Python
Pytorch 实现sobel算子的卷积操作详解
2020/01/10 Python
python怎么对数字进行过滤
2020/07/05 Python
携程英文网站:Trip.com
2017/02/07 全球购物
Sandro Paris美国官网:典雅别致的法国时尚服饰品牌
2017/12/26 全球购物
理工大学毕业生自荐信
2013/11/01 职场文书
策划主管的工作职责
2013/11/24 职场文书
舞蹈比赛获奖感言
2014/02/04 职场文书
医学检验专业自荐信
2014/09/18 职场文书
简单的辞职信怎么写
2015/02/28 职场文书
茶花女读书笔记
2015/06/29 职场文书
门卫管理制度范本
2015/08/05 职场文书