将Vue.js项目部署到服务器的详细步骤

序

最近完成了一个项目，Vue.js 2.0 vuex axios，还是有点大。想着做了这么久，让朋友体验一下服务器，帮助发现bug，于是有了一篇研究服务器的文章。

准备工作/即将工作

计算机网络服务器

既然部署到服务器上，肯定需要云。我在从同性恋朋友那里找一个。如果我做测试，可以买阿里巴巴云的学习机9.9个月，但如果我不是学生，就比较麻烦了，因为敏感操作需要验证码。

编译并打包

把项目打包成dist文件，我需要跨域请求一些数据，写一个小服务器，app.js放在dist文件夹的同一个目录下。

Xshell

因为gay friends的服务器是centos，所以使用xshell稍微容易一点。我赢了。

WinSCP

我不怎么接触命令行，所以在命令行编程方面还是有点效率不高。该软件便于上传、编辑等。和图形界面。

正式开始

有了以上各项，就可以正式开始部署工作了。

登录到WinSCP并连接到远程服务器

打开WinSCP，会出现如下界面

主机名，输入你服务器的公共ip，端口号不变，用户名一般是root，密码是你购买服务器时设置的密码。单击登录。

默认为/root接口。

此时，将打包的文件放入某个目录中，如同一目录中的/opt、dist和app.js

登录Xshell以连接到远程服务器

打开Xshell，第一次登录会有如下界面：

您可以选择任何名称，选择SSH作为协议，主机就是您的公共ip。

稍后会有这一页

我在这里创建的，你可以直接点击连接。如果您来自上一步，则需要在单击后输入密码。

然后连接到远程Linux系统。

安装node.js

因为我的项目需要跨域请求数据，这里我选择使用Node.js来启动一个小型服务器并请求数据。

下载源代码，解压源代码，编译，安装，下载源代码。以最新的6.11.1为例：

CD/usr/local/src/wget http://nodejs.org/dist/v6.11.1/node-v6.11.1.tar.gz解压源代码：

编译并安装CD/usr/local/src/tar zxvf节点-v6.11.1.tar.gz:

CD node-v 6 . 11 . 1 ./configure-prefix=/usr/local/node/6 . 11 . 1 make make install在这里，make过程大约需要30分钟，所以可以做点别的。

Ps:这里我有一个问题，服务器没有安装G，所以直接

百胜安装gcc-c就可以了。

安装完成后，还需要为节点配置环境变量

在这里，通过WinSCP找到/etc/profile，右键点击文件并编辑。

在导出路径用户日志名称邮件主机名历史大小历史控件上方的行中添加以下代码：

# set for nodejs导出node _ home=/usr/local/node/6 . 11 . 1导出路径=$ node _ home/bin: $ path ctrl s保存并退出，然后编译它

源/etc/profile然后节点-v验证安装是否成功

之后，安装守护程序，并设置引导自启动。保证自己编写的小服务器可以在没有Xshell的服务器上运行

全局安装：

Npm install pm2 -g进入/opt(这里是您放置dist和app.js的目录)并执行命令：

PM2 startapp . js-watch PM2 save PM2 startup如果服务器端没有防火墙来丢弃端口，我们应该可以愉快地看到我们的项目。

但是，如果服务器端有防火墙，端口掉线了怎么办？

Vps，安装iptables:

Yum install -y iptables-service粗暴地关闭了防火墙(不推荐):

systemctl停止firewalld.servicesystemctl禁用firewalld . serviceyum install-y iptables-service//如果上面安装了iptables，则不需要iptables-f iptables-x iptables-zip tables-savesystemctl重新启动iptables.service单独打开端口(推荐):

查看状态：

Iptables -L -n添加对以下特定端口开放的方法：

使用iptables打开以下端口

/sbin/iptables-I输入-p TCP-dport8000-j接受保存

/etc/rc.d/init.d/iptables保存以重新启动服务

服务iptables重新启动，以查看要打开的端口是否有效

/etc/init.d/iptables状态方法2:

或者直接编辑/etc/sysconfig/iptables

-上一节中保存了一个输入-p TCP-m TCP-dport4000-j接受

再次重启：

如果iptables重启服务是阿里巴巴云，则在安全组规则中添加相应的规则。

摘要

以上就是边肖介绍的将Vue.js项目部署到服务器的详细步骤，希望对大家有所帮助。如果你有任何问题，请给我留言，边肖会及时回复你。非常感谢您对我们网站的支持！