nginx 部署前端项目的详细步骤（vue项目build打包+nginx部署(1)

    location / {
        root   html; # 访问根目录 nginx-1.21.0\html
        index  index.html index.htm; # 入口文件,可以接收index、index.html、index.htm文件
    }
}

}

#### 2.2.3 搭建不同网站的站点


 在其他配置文件'self'目录下，添加新建站点的配置**文件'xxx.conf'**


![](https://img-blog.csdnimg.cn/e19edeca0fd44ce9864ddba290ac84e6.png)

server {
listen 8070; # 自定义监听端口
server_name 127.0.0.1; # 浏览器访问域名

charset utf-8;
access_log  logs/xx_domian.access.log  access;

# 路由
location / {
    root   dist; # 访问根目录 nginx-1.21.0\dist
    index  index.html index.htm; # 入口文件类型
}

}

![](https://img-blog.csdnimg.cn/e6f4a8f7c67c44efad2ff6c6e526803e.png)


![](https://img-blog.csdnimg.cn/75492e722d4144b09f35f0794dd8b5e0.png)


#### 2.2.4 禁止访问的目录以及一键申请SSL证书验证目录相关设置

#禁止访问的文件或目录
location ~ ^/(\.user.ini|\.htaccess|\.git|\.svn|\.project|LICENSE|README.md)
{
    return 404;
}

#一键申请SSL证书验证目录相关设置
location ~ \.well-known{
    allow all;
}

#### 2.2.5 根据文件类型设置过期时间

# location ~ .*\.(gif|jpg|jpeg|png|bmp|swf)$
# {
#     expires      30d; // 30天过期
#     access_log off;
# }

# location ~ .*\.(js|css)?$
# {
#     expires      12h;
#     access_log off; 
# }

#### 2.2.6 禁止文件缓存

location ~* .(js|css|png|jpg|gif)$ {
add_header Cache-Control no-store;
}