使用docker部署Nuxt.js项目,实现服务端渲染
最近我把原来域名的网站用nuxt.js写了一下,大概是这样的效果


为什么要这样做?
- 为了解决BA问题,所以使用了新的域名www.sunofbeach.net
- 我已经写了一个blog程序,是使用java+thymeleaf写的,现在改成nuxt.js,Java部署的时候点的内存有点大
- 使用Nuxt.js实现前后端分类,服务端渲染有利于SEO
写完了部署
部署方式使用docker来部署吧,比较方便,直接有现成的环境
node版本
编写Dockerfile文件
#基于镜像node,版本自己查看上面的链接
FROM node:10.15.3
#作者
MAINTAINER sunofbeach.net
#参数,node的环境为生产环境
ENV NODE_ENV=production
#任意ip
ENV HOST 0.0.0.0
#容器内创建目录blog
RUN mkdir -p /blog
#复制当前的内容到容器内容部目录blog
COPY . /blog
#切换工作目录到blog
WORKDIR /blog
#暴露端口3000,默认端口
EXPOSE 3000
#配置npm的远程仓库
RUN npm config set registry https://registry.npm.taobao.org
#安装依赖
RUN npm install
#构建,生成dist文件
RUN npm run build
#start
CMD ["npm","start"]
Dockerfile与文件同在

然后,开始构建镜像
构建
docker build -t sob-blog .
重要,不要漏掉点
运行
构建完以后,运行:

docker run --name=sob-blog -p 8080:3000 -dt sob-blog
我这里映射宿主机的端口到8080,也就是说,我访问宿主机的8080端口,就是访问sob-blog
通常来说,同学们使用80端口,宿主机的80端口,然后加上域名解析,就可以访问了。
我这里还有一层nginx,也就是我的域名指向宿主机,然后由nginx指向8080端口访问docker上的sob-blog
sob-blog由nginx代理。如果同学们只有一个网站就使用80端口就可以了。直接解析进来。
查看部署结果
部署完成的效果,www.sunofbeaches.com
右键查看源码,你会发现很多内容,包括博客内容,这样就有利于SEO了
另外,查看一下占用的内存

还得运行一段时间,查看内存使用情况。这样看来,貌似解决了前面我们提到的三个问题了。