接触 Nuxt 大概有一个多月了,对于一些小型网站,不需要前后端分离的,是个好的选择
比如最近就做了一个 me.imba97.cn,准备放一些关于我的东西
大概长这样
除了这个简历,我把之前的 《写了个简单的页面,分享此时此刻在听的歌》 也迁过去了
你可以访问 me.imba97.cn/playing 查看
之前接口是用的 PHP
,因为涉及到后端,需要 Node 环境,借助 GPT
简单写了个 Dockerfile
FROM node:18
# 创建并设置工作目录
WORKDIR /usr/src/app
# 复制所有源代码到工作目录
COPY . .
# 安装 pnpm
RUN npm install -g pnpm
# 安装项目依赖
RUN pnpm install
# 构建 Nuxt
RUN pnpm run build
# 暴露端口(默认端口为 3000 ,可以通过环境变量 NUXT_PORT 配置)
ENV NUXT_PORT=3000
EXPOSE ${NUXT_PORT}
# 启动 Nuxt.js 应用程序
CMD [ "pnpm", "start-docker" ]
start-docker
是以下命令
nuxt start --hostname 0.0.0.0 --port $NUXT_PORT
配置了自动打包 Docker 镜像并发布
name: Build and Push Docker Image
on:
push:
tags:
- 'v*'
jobs:
build:
runs-on: ubuntu-latest
steps:
- name: Checkout repository
uses: actions/checkout@v2
- name: Set up Node.js
uses: actions/setup-node@v2
with:
node-version: '18'
- name: Install dependencies
run: npm install
- name: Build the project
run: npm run build
- name: Log in to Docker Hub
uses: docker/login-action@v2
with:
username: ${{ secrets.DOCKER_USERNAME }}
password: ${{ secrets.DOCKER_PASSWORD }}
- name: Build and tag Docker image
run: |
TAG_NAME=$(echo $GITHUB_REF | sed 's/refs\/tags\///')
docker build . -t ${{ secrets.DOCKER_USERNAME }}/me:latest
docker tag ${{ secrets.DOCKER_USERNAME }}/me:latest ${{ secrets.DOCKER_USERNAME }}/me:$TAG_NAME
- name: Push Docker image to Docker Hub
run: |
TAG_NAME=$(echo $GITHUB_REF | sed 's/refs\/tags\///')
docker push ${{ secrets.DOCKER_USERNAME }}/me:latest
docker push ${{ secrets.DOCKER_USERNAME }}/me:$TAG_NAME
我是部署在家里路由器上的,为了方便又简单写了个脚本
#!/bin/sh
docker stop imba97-me
docker rm imba97-me
docker pull imba97/me:latest
docker run -d --name imba97-me -p 3000:3000 --restart always imba97/me:latest
有兴趣可以看一下 Github: imba97/me
虽然之前看到过有自动更新容器的方法,不过目前先这样了
Nuxt Docker 镜像倒是也有不少,但还是想自己搞一个单独的
我目前在积极寻找远程全职工作,有兴趣可以联系我,谢谢