Awesome
mmf-blog vuejs 3.0 v3 中文说明
demo: http://www.mmxiaowu.com
The main technical stack: vue 3, vue-router 4, pinia, vitejs 5, unocss, eslint, pwa, ssr
Other versions
react(spa): https://github.com/lincenying/mmf-blog-react-v2
react(hooks spa): https://github.com/lincenying/mmf-blog-vite-react
vue2(spa): https://github.com/lincenying/mmf-blog-vue2
vue2(pwa ssr): https://github.com/lincenying/mmf-blog-vue2-pwa-ssr
vue3(spa): https://github.com/lincenying/mmf-blog-vite-vue3
vue3(pwa ssr): https://github.com/lincenying/mmf-blog-vite-vue3-ssr
nuxt3: https://github.com/lincenying/mmf-blog-vite-nuxt
First installation api server:
express-ts: https://github.com/lincenying/mmf-blog-api-ts
Project setup
pnpm install & npx simple-git-hooks
Compiles and hot-reloads for development
pnpm serve
Compiles and minifies for production
pnpm build
Preview for production
pnpm start
Lints and fixes files
pnpm lint
docker
1. 构建 api-server 容器
克隆 https://github.com/lincenying/mmf-blog-api-ts 仓库后, 按文档中的操作, 构建api server镜像, 并启动容器
2. 构建 web 容器
# 构建镜像
docker build -t images-mmf-blog-vite-vue3-ssr -f ./Dockerfile .
# 运行镜像
docker run -d -p 7777:7777 --add-host=host.docker.internal:host-gateway --name container-mmf-blog-vite-vue3-ssr images-mmf-blog-vite-vue3-ssr
# 进入镜像
docker exec -it container-mmf-blog-vite-vue3-ssr /bin/bash
# 停止容器
docker stop container-mmf-blog-vite-vue3-ssr
# 删除容器
docker rm container-mmf-blog-vite-vue3-ssr
# 删除镜像
docker rmi images-mmf-blog-vite-vue3-ssr
docker-compose
使用docker-compose, 将会从docker hub拉取api-server镜像, 并且启动容器
如果已经将api-server镜像传到docker hub, 修改docker-compose.yml中的api.image配置, 镜像改成自己的
api:
container_name: api-server
image: lincenying/api-server:1.0.1
修改docker-compose.yml中的mongo.volumes配置, 将宿主机数据库路径映射到容器中
volumes:
- /Users/lincenying/web/mongodb/data:/data/db
# 生成镜像及启动容器
docker-compose build
docker-compose up -d
# 自动从docker hub拉取mongodb, api-server, web-server镜像, 并启动运行容器
docker-compose up -d -f docker-compose.prod.yml
Home Site http://localhost:7777
Login http://localhost:7777/backend/login
LICENSE
MIT