前面我已经成功将Vue项目生成的dist文件夹上传服务器,并通过nginx,在服务器搭起了网站,但是小组作业需要把整个项目都放到docker(我这只是项目中customer那部分而已),所以我尝试着生成docker镜像,方便其他组员使用。
首先我把dist文件夹还有之前修改过的nginx的配置文件nginx.conf放在同一个目录,然后准备在这个目录编写Dockerfile(本目录就只有dist文件夹、nginx.conf、Dockerfile这三样东西),写好之后就可以生成镜像了。
我最终要得到的镜像是在指定位置放置好了dist文件夹的nginx,这样当别人用这个镜像生成容器,我的前端项目也就直接能跑起来了。
不知道是不是docker里最新版本的nginx和我在服务器配置的nginx版本不同,我发现它们的文件结构是不一样的,docker里直接安装的nginx配置文件在镜像内的/etc/nginx/nginx.conf位置,具体内容也有所不同,它将原来的nginx.conf的内容分成了两个文件,在其中include了它的另外一部分,不过总体是和之前的nginx.conf等价的,因此我们将之前准备的nginx.conf将镜像内的nginx.conf覆盖也不会出问题,只是资源的路径要做相应改动。由于我打算将项目放在镜像的/usr/share/nginx/customer/dist位置,并开放8889端口,因此nginx.conf部分配置如下:
# yang jianfeng add for web server
server {
listen