nginx部署dist 配置
时间: 2024-04-13 21:06:30 浏览: 21
1. 首先需要安装nginx,在Linux系统中可以使用以下命令进行安装:
```bash
sudo apt-get update
sudo apt-get install nginx
```
2. 然后在nginx的配置文件中添加以下内容:
```nginx
server {
listen 80;
server_name your-domain.com;
root /var/www/your-app/dist;
index index.html index.htm;
location / {
try_files $uri $uri/ /index.html;
}
}
```
其中,`your-domain.com`是你的域名,`/var/www/your-app/dist`是你的dist目录所在的路径。
3. 保存配置文件并重启nginx服务:
```bash
sudo service nginx restart
```
4. 访问你的域名,就能看到你部署的dist文件了。
相关问题
windows用nginx部署dist
部署dist文件夹可以使用Nginx来实现静态文件的部署,具体操作步骤如下:
1. 下载Nginx,并解压到指定目录。
2. 在Nginx的配置文件中添加以下代码,以指定dist文件夹的路径:
```
server {
listen 80;
server_name localhost;
location / {
root C:/path/to/dist;
index index.html index.htm;
try_files $uri $uri/ /index.html;
}
}
```
其中,root指定了dist文件夹的路径,try_files指定了如果访问的是不存在的文件,则返回index.html文件。
3. 启动Nginx,并访问http://localhost即可查看部署的dist文件夹内容。
注意:以上代码仅适用于在Windows系统上部署dist文件夹,如果在Linux系统上部署,则需要将路径中的斜杠改为反斜杠。
docker部署nginx配置前端dist
docker部署nginx配置前端dist的步骤如下:
1. 编写Dockerfile,设置基础镜像为nginx:alpine,并将dist文件中的内容复制到/app/dist目录下:
```
# 设置基础镜像
FROM nginx:alpine
# 将dist文件中的内容复制到/app/dist目录下
COPY dist/ /app/dist
# 用本地的default.conf配置文件替换nginx镜像里的默认配置
COPY default.conf /etc/nginx/conf.d/default.conf
```
2. 编写nginx配置文件default.conf,配置前端的访问规则和代理转发规则:
```
upstream backendapi {
server backend-api:9527;
}
server {
listen 80;
server_name localhost;
access_log /var/log/nginx/host.access.log main;
error_log /var/log/nginx/error.log error;
location / {
root /app/dist;
index index.html index.htm;
try_files $uri $uri/ /index.html;
}
error_page 500 502 503 504 /50x.html;
location /api/ {
rewrite /api/(.*) /$1 break;
proxy_pass http://backendapi;
}
}
```
3. 执行以下命令制作镜像:
```
# 把Dockerfile、default.conf、dist放在同级目录下
# 创建容器
docker build -t frontend/web .
# 给容器打上标签
docker tag frontend/web:latest harbor/frontend/web:latest
# 登录harbor容器仓库
docker login harbor
# 输入账号密码
# 推送打上标签的容器到harbor仓库
docker push harbor/frontend/web:latest
```