CentOS node环境安装

进入下载安装包存放目录
cd /usr/local/
  
 下载安装包
wget https://npm.taobao.org/mirrors/node/v11.15.0/node-v11.15.0-linux-x64.tar.gz

解压安装包
tar -zxvf node-v11.15.0-linux-x64.tar.gz

重命名为node
mv node-v11.15.0-linux-x64 node

配置环境变量
vi /etc/profile

export NODE_HOME=/usr/local/node
export PATH=$NODE_HOME/bin:$PATH

使环境变量生效
source /etc/profile

验证是否安装配置成功
node -v

镜像安装

npm install -g cnpm --registry=https://registry.npm.taobao.org

PC后台管理前端部署

1、 使用WinSCP工具上传，PC后台管理前端工程到服务器自定义的目录下

如：/usr/local/project/test-vue

2、进入工程目录下，执行命令

      npm install（第一次 需要执行）

如果npm install 错误 安装 chromedriver 失败的解决办法

首先经过npm install后，会生成node_modules，先清除它

rm -rf node_modules

可以使用下面的命令安装：

npm install chromedriver --chromedriver_cdnurl=http://cdn.npm.taobao.org/dist/chromedriver    

如果是root用户进行安装则使用下面的命令安装：

npm install chromedriver --chromedriver_cdnurl=http://cdn.npm.taobao.org/dist/chromedriver --unsafe-perm

--unsafe-perm 参数说明：

npm 出于安全考虑不支持以 root 用户运行，即使你用 root 用户身份运行了，npm 会自动转成一个叫 nobody 的用户来运行，而这个用户几乎没有任何权限。这样的话如果你脚本里有一些需要权限的操作，比如写文件（尤其是写 /root/.node-gyp），就会崩掉了。

为了避免这种情况，要么按照 npm 的规矩来，专门建一个用于运行 npm 的高权限用户；要么加 --unsafe-perm 参数，这样就不会切换到 nobody 上，运行时是哪个用户就是哪个用户，即使是 root。

3、编译工程，执行命令

     npm run build

4、在工程的目录下会生成dist目录，目录中会config、2009231158（随机生成）、index.html

拷贝到/usr/local/project/adminvue 目录下。

用户前端部署

1、项目打包

使用hbuilder导入用户前端项目，hbuilder的右上方 【文件】【导入】选择【本地导入】

2、这里比如：打包H5网站，在hubilder中选择网站-h5手机版发行

3、在hbuilder控制台查看打包进度，打包完成后点击进入目录

4、H5网站添加文件夹中的文件上传到服务器对应目录下

如：/usr/local/project/uservue

配置nginx

安装nginx略过，不是重新介绍，主要介绍如果结合nginx配置运行，配置参考如下：

1、添加用户前端访问配置

server {
        listen      80;
        server_name user.你的域名.com;
        root /usr/local/project/uservue;
        index index.html;
  
        # 服务器端api接口
        location ^~/api{
            proxy_pass http://localhost:8080/api;
       
        }
        # 图片代理
        location ^~/img{
           proxy_pass https://xianyunb.oss-cn-hangzhou.aliyuncs.com/;
       
        }
        # 用户前端访问对应目录
        location / {
            try_files $uri $uri/ /index.html last;
            add_header Access-Control-Allow-Origin *;
            alias  /usr/local/project/uservue/$1;
        }
        
        location ~ .*\.(gif|jpg|jpeg|png|bmp|swf|html|txt|p12)$ {
            expires      30d;
            error_log off;
            access_log /dev/null;
        }
    
    }

2、添加管理后台前端访问配置

server {
        listen      80;
        server_name admin.你的域名.com;
        root /usr/local/project/uservue;
        index index.html;
  
        # 服务器端api接口
        location ^~/api{
            proxy_pass http://localhost:8080/api;
       
        }
        # 图片代理
        location ^~/img{
           proxy_pass https://xianyunb.oss-cn-hangzhou.aliyuncs.com/;
       
        }
        # 管理后台前端访问对应目录
        location / {
            try_files $uri $uri/ /index.html last;
            add_header Access-Control-Allow-Origin *;
            alias  /usr/local/project/adminvue/$1;
        }
        
        location ~ .*\.(gif|jpg|jpeg|png|bmp|swf|html|txt|p12)$ {
            expires      30d;
            error_log off;
            access_log /dev/null;
        }
    
    }

3、重启nginx

 /usr/local/nginx/sbin/nginx -s reload

到此部署完成，上面主要介绍vue前端生产环境的部署，服务端部署和域名绑定配置不作介绍。