IDEA Dockerfile部署Vue项目

最新推荐文章于 2025-03-05 00:46:06 发布

苏叶新城

最新推荐文章于 2025-03-05 00:46:06 发布

阅读量975

点赞数

分类专栏： Intellij idea 文章标签： idea docker nginx

本文链接：https://blog.youkuaiyun.com/haha_201510/article/details/118469223

版权

Intellij idea 专栏收录该内容

2 篇文章

订阅专栏

本文详细介绍如何配置Docker远程访问，并使用Docker部署Vue项目。包括设置Docker服务、IDEA配置、创建Dockerfile及配置文件，最终实现通过外部端口访问Vue应用。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

前提条件

已部署好Docker环境

开启Docker的远程控制

查看Docker运行状态systemctl status docker

编辑图片中Docker服务文件

vim /usr/lib/systemd/system/docker.service

在ExecStart配置后添加-H tcp://0.0.0.0:2375

[Service]
Type=notify
# the default is not to use systemd for cgroups because the delegate issues still
# exists and systemd currently does not support the cgroup feature set required
# for containers run by docker
ExecStart=/usr/bin/dockerd -H fd:// --containerd=/run/containerd/containerd.sock -H tcp://0.0.0.0:2375
ExecReload=/bin/kill -s HUP $MAINPID
TimeoutSec=0
RestartSec=2
Restart=always

重启Docker

systemctl daemon-reload
systemctl restart docker

配置IDEA Docker

首先IDEA安装Docker插件，默认已安装配置

连接服务器端Docker

Docker配置位置setting| Build, Execution, Deployment | Docker

添加Docker引擎地址http://192.168.0.10:2375,对应Docker部署服务器的地址，地址填写后，会校验地址连接

[外链图片转存失败,源站可能有防盗(img-r9http://wijnQ.xu54.xyz/blo11075086)()

部署Vue项目

添加Dockerfile

在Vue项目根目录添加Dockerfile文件

FROM nginx
ENV TZ=PRC
RUN ln -snf /usr/share/zoneinfo/$TZ /etc/localtime && echo $TZ > /etc/timezone
MAINTAINER xxx@xx.com
RUN rm /etc/nginx/conf.d/default.conf
COPY default.conf /etc/nginx/conf.d/
COPY dist/ /usr/share/nginx/html/

根目录添加default.conf

server {
        listen       80;
        server_name  localhost;

        location / {
            root   /usr/share/nginx/html; #配置前端静态页位置
            try_files $uri $uri/ /index.html;
            index  index.html index.htm;
        }
        #代理多个路径auth|pay    
        location ~* ^/(auth|pay){
            proxy_set_header Host $http_host;
            proxy_set_header X-Real-IP $remote_addr;
            proxy_set_header REMOTE-HOST $remote_addr;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
            proxy_pass http://10.10.0.99:9000;
        }

        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
            root   html;
        }
}