vuejs2.0入门实战-从零开发一个todoApp应用并部署上线教程（三）:部署上线

vuejs2.0实战-从零开发todoApp应用并部署上线教程（一）:事前准备
vuejs2.0实战-从零开发todoApp应用并部署上线教程（二）:代码编写
->vuejs2.0实战-从零开发todoApp应用并部署上线教程（三）:部署上线

至此，项目已经编写完成了。
接下来就是如何对项目进行最后一步的上线

传输文件

在项目文件夹下面生成生产环境(production)的项目文件
输入命令:
npm run build

生成的最终项目会产生在 ./dist文件夹中

ok，到了这一步，只需要把它传输到服务器即可。

从网上找到的scp 传输命令

本地拷文件夹到服务器端 (包括文件夹本身)
scp -r   ~/todoapp/dist [email protected]:/home/wwwroot/project/todoapp

关于scp命令使用方法：

从 本地 复制到 远程 
====== 
* 复制文件： 
        * 命令格式： 
                scp local_file remote_username@remote_ip:remote_folder 

* 复制目录： 
        * 命令格式： 
                scp -r local_folder remote_username@remote_ip:remote_folder 

从远程复制到本地，只要将从本地复制到远程的命令的后2个参数调换顺序即可； 

例如： 
        scp [email protected]:/home/root/others/music /home/space/music/1.mp3 
        scp -r www.abc.com:/home/root/others/ /home/space/music/

---

使用putty进行远程服务器的操作

若尚未安装，则:

sudo apt-get install putty
putty

此时在弹出putty的窗口中，输入ip地址以及端口，如果没有更改过，请保持默认端口（port: 22）

连接上之后，输入账号、密码。

这里我们使用ngnix服务器，

安装教程 ：
详解Linux下安装配置Nginx
Ubuntu 14.04 安装最新稳定版Nginx 1.6.0
Ubuntu-Nginx安装详解 [推荐]

怕链接会挂掉，这里还是简略写一下过程吧

Nginx安装之前需要三个支持：

模块依赖性

①gzip 模块需要 zlib 库 

②rewrite 模块需要 pcre 库 

③ssl 功能需要 openssl 库 

预先编译好的包:

sudo apt-get install libpcre3 libpcre3-dev libpcrecpp0 libssl-dev zlib1g-dev

 

ububtu平台编译环境可以使用以下指令：

apt-get install build-essential

apt-get install libtool

一般我们都需要先装pcre, zlib，前者为了重写rewrite，后者为了gzip压缩。



下面是安装步骤：

1.选定源码目录：可以是任何目录,这里是 cd /usr/local/src
2.安装PCRE库:安装zlib库:安装ssl（某些vps默认没装ssl):

sudo apt-get install libpcre3 libpcre3-dev libpcrecpp0 libssl-dev zlib1g-dev

--------

3.安装nginx:

Nginx 一般有两个版本，分别是稳定版和开发版，您可以根据您的目的来选择这两个版本的其中一个，下面是把 Nginx 安装到 /usr/local/nginx 目录下的详细步骤：(注意：需要在sudo下)

cd /usr/local/src

wget http://nginx.org/download/nginx-1.4.2.tar.gz

tar -zxvf nginx-1.4.2.tar.gz

cd nginx-1.4.2

 

./configure 

make

make install

6.查看端口状态：netstat -ano|grep 80

7.启动Nginx：sudo /usr/local/nginx/sbin/nginx

8.打开浏览器访问机器的IP，会看到Welcome页面，证明安装成功

关于常用的ngnix命令：

#重启nginx服务
service nginx -s  reload

#启动Nginx
sudo /usr/local/nginx/sbin/nginx

修改Nginx的配置文件 nginx.config
配置nginx监听80端口， location /project/todoapp alias 到 /home/wwwroot/project/todoapp/dist，

location /project/todoapp {
    alias /home/wwwroot/project/todoapp/dist;
}

重启nginx
service nginx -s reload

访问 http:ip/project/todoapp 即可