web前端项目部署到服务器：

1.git项目到指定目录下

git clone https://github.com/webDemo

2.在项目根目录下执行npm命令

npm init
npm install
npm run build

执行成功后会生成dist文件

3.把dist文件拷贝到nginx目录下

eg: cp -r dist  usr/local/nginx/html/

4.配置nginx

4.1 进入到nginx配置目录：/usr/local/nginx/conf,对 nginx.conf 文件进行配置

user  root;
worker_processes  1;

#error_log  logs/error.log;
#error_log  logs/error.log  notice;
#error_log  logs/error.log  info;

#pid        logs/nginx.pid;


events {
    worker_connections  1024;
}

http {
    include       mime.types;
    default_type  application/octet-stream;

    #log_format  main  '$remote_addr - $remote_user [$time_local] "$request" '
    #                  '$status $body_bytes_sent "$http_referer" '
    #                  '"$http_user_agent" "$http_x_forwarded_for"';

    #access_log  logs/access.log  main;

    sendfile        on;
    tcp_nopush     on;

    #keepalive_timeout  0;
    keepalive_timeout  65;
    include demo/*.conf;
}

使用include可以配置多个.conf文件，如一个项目一个配置文件。在同目录下创建demo文件夹，并创建demo.conf配置文件

下面使用是以ip地址的方式创建的的配置文件

demo.conf

 server {
     listen       80;
     server_name locathost;
     client_max_body_size 10M;
     location  /{
        root  "/usr/local/nginx/html";
        index  index.html index.htm;
        autoindex  off;
    }
     #java接口访问地址配置，待续
     location /demoapi/ {
            proxy_pass http://127.0.0.1:9898;
            include uwsgi_params;
    }
}

访问地址：

http://192.168.1.233/dist

其中dist名称时可以修改，保持与/usr/local/nginx/html下cp名称一致，否则会访问不到;并且/usr/local/nginx/html目录可存在同一ip下多个web项目。

域名与ip绑定

1.域名备案成功后，把ip地址与域名备案绑定
    域名服务 -> 域名列表 -> 操作 （解析）
  
2.https配置
    SSL证书->数字证书管理服务->免费证书->创建证书->申请->下载Nginx
    
3.登录服务器
     在/usr/local/nginx/conf创建cert 存放数字证书

4.配置demo.conf

配置域名demo.conf
eg: 域名 - demo.cn

upstream apitomcat { 
    server 127.0.0.1:8888; 
    server 127.0.0.1:9898; 
} 
server {
    listen       80;
    server_name  www.demo.cn admin.demo.cn api.demo.cn;
    rewrite ^(.*)$  https://$host$1 permanent;
}
server {
    listen       80;
    server_name  demo.cn;
    rewrite ^(.*)$  https://www.demo.cn permanent;
}
server {
    listen 443 ssl;
    server_name www.demo.cn;
    client_max_body_size 10M;
    ssl_certificate   cert/***_www.demo.cn.pem;
    ssl_certificate_key  cert/***_www.demo.cn.key;
    ssl_session_timeout 5m;
    ssl_ciphers ECDHE-RSA-AES128-GCM- 
   SHA256:ECDHE:ECDH:AES:HIGH:!NULL:!aNULL:!MD5:!ADH:!RC4;
    ssl_protocols TLSv1 TLSv1.1 TLSv1.2;
    ssl_prefer_server_ciphers on;
    root  "/home/develop/projects/xxx/xxxwww";
    location / {
        index  index.html index.htm;
        autoindex  off;
    }
}

4.2阿里云配置域名前缀
阿里云->域名->域名列表—>域名 管理-> 域名解析->解析设置

如图：记录值 填写当前服务ip

域名前缀.png

学习过程中所记录，有问题或者有好的方式欢迎指点。不胜感激 🤗 🤗 🤗