Vue项目部署到docker的Nginx上 访问路径配置
时间: 2024-03-26 17:39:12 浏览: 29
当将 Vue 项目部署到 Docker 容器中时,需要配置 Nginx 的访问路径。
假设你的 Vue 项目在 Docker 容器中的路径为 `/usr/src/app/dist`,那么可以在 Nginx 的配置文件中添加以下内容:
```
server {
listen 80;
server_name your_domain.com; # 替换为你的域名
location / {
root /usr/src/app/dist;
index index.html;
try_files $uri $uri/ /index.html;
}
}
```
这个配置将会把所有请求都重定向到 `/usr/src/app/dist` 目录下,并且尝试读取 `index.html` 文件。这样,当用户访问你的域名时,就会自动加载 Vue 的入口文件 `index.html`,从而正确渲染你的 Vue 应用程序。
如果你使用的是 HTTPS 协议,还需要在配置文件中添加 SSL 证书的相关信息。例如:
```
server {
listen 443 ssl;
server_name your_domain.com; # 替换为你的域名
ssl_certificate /path/to/your/cert.pem;
ssl_certificate_key /path/to/your/key.pem;
location / {
root /usr/src/app/dist;
index index.html;
try_files $uri $uri/ /index.html;
}
}
```
这个配置将会把所有 HTTPS 请求都重定向到 `/usr/src/app/dist` 目录下,并且尝试读取 `index.html` 文件。注意,你需要将 `/path/to/your/cert.pem` 和 `/path/to/your/key.pem` 替换为你的 SSL 证书和密钥的路径。
相关推荐
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)