截止昨天已经完成了前后端应用的基础开发,那么传统的部署相信大家都是知道的。我们这里还是来说说一般一个vue的项目该如何部署,有那些部署方式:
1、构建静态网站,就是将dist文件夹内容部署到常见的服务器或托管商,比如githubpages。
2、搭建本地服务器,使用nodejs内置的http模块搭建服务器,将dist内容丢上去,访问服务器地址就可以查看vue网页。
3、容器化,利用docker,打包镜像,将dist文件夹内容复制到镜像中,然后启动容器即可访问网站。
4、部署到pass运营商的平台,比如aws,可以自动构建项目提供url进行访问,但是要花钱。
5、部署到k8s上,这个要具备基本的k8s部署流程,稍微复杂一丢丢。
那么,由此可知,传统的部署方式大家都知道怎么弄,今天就搞一下主流的容器化,虽然也马上要过时了,毕竟智能时代,新技术是迅速迭代。搞技术要么适应要么被抛弃。
那么我们就直接实操,看看如何将一个vue项目容器化部署:
首先,需要编写一个Dockerfile,如何灵活编写这一部分知识会在知识星球分享,感兴趣的朋友可以加入(限免)
前端应用容器化
那么我们在容器中需要两个应用,一个用来构建vue应用一个用于运行,当然你在外部构建好也是可以的,只用一个运行容器。
1、编写dockerfile
一般应该看的懂,就是在node容器里执行构建,然后将构建好的文件放到nginx服务器里,一般前端大佬都会。
2、构建docker镜像,运行命令:
3、启动容器并暴露端口
4、访问vue应用,打开浏览器
如上图所示,那么就算完成容器化了,很简单吧,那么接着在容器化我们的后端项目,流程也是一样的。
后端应用容器化
后端项目容器化
1、编写dockerfile
2、构建镜像
3、启动后端项目容器并暴露端口
4、访问昨天开发的接口,打开浏览器访问
如图所示即可访问应用。
现在前后端都已经容器化了,那么再从前端访问后端,看看是否有信息:
这么一看,确实有信息,前后端的容器化是实现了,我们再看看运行的进程:
前后端程序都在运行中,所以今天的前后端容器化是完成了,后面就需要将镜像推送到公共库或者私有镜像库,以供k8s使用,这样就能直接部署在K8s集群中了。
好了,今天关于前后端应用如何容器化的流程就介绍完了,这是比较通用的流程,不管是什么语言,只要在dockerfile指定对应的编译和运行环境即可。感兴趣的朋友记得关注点赞呀!
领取专属 10元无门槛券
私享最新 技术干货