warriorbrian/nuxt-blog

基于Nuxt.js服务器渲染(SSR)搭建的个人博客系统

nuxt blog 是一套基于nuxt与node开源博客系统，于2018年5月正式发布第一版至今，经过不断的迭代升级为目前的2.0以上版本。

舍弃繁杂，拥抱简约！

目录结构

├── manage-ui/                       后台管理项目目录
├── server/                          后端项目目录
├── prometheus/                      prometheus监控目录
└── nuxt/                            前端博客页面

构建与运行

# nuxt localhost:8083

$ npm install

# server localhost:3000
# server websocket port: 3002
$ npm install

# serviceUI localhost:8080

$ npm install

部署

目前使用docker部署，请确保服务器已经安装docker及docker-compose

进行服务打包，在docker中打包可能存在慢的情况，请耐心等待，如果出现网络问题，请多试几次。

1. 确认manage-ui中.env环境是否正确:

VUE_APP_WS_ADDRESS=ws://服务器IP:3002

将websocket地址设置为部署服务器IP，并暴露3002端口.

2. 确认server中.env环境是否正确:

PROMETHEUS_ADDRESS=http://服务器IP:9090

将地址设置为部署服务器IP，并暴露9090, 9100端口.

prometheus相关文档: prometheus部署文档

3. 确认server中ormconfig.json配置是否正确:

{
  ...
  ...
  "host": "mysql", // docker部署，如果是生成环境写为mysql服务名
  "port": 3306,
  "username": "root",
  "password": "root", // 根据实际情况进行填写数据库密码
  "database": "blog"
  ...
  ...
}

4. 确认nuxt中.env环境是否正确:

PROD_PROXY_ADDRESS=http://server:3000

此配置通常为nuxt项目代理配置，如果是生产环境，则使用以上配置，如果是开发环境则修改为http://localhost:3000即可.

以上配置完成后，进行打包部署:

$ docker-compose build

打包过后，运行部署:

数据卷会保存在/opt目录下进行数据持久化

$ docker-compose up -d

说明

默认后台登录用户名: demo

默认后台登录密码: 123

请在登录后进行创建账号密码，重新登录并删除测试默认账号密码。

相关文档:

• server相关说明文档: server文档

• nuxt相关说明文档: nuxt文档

• manage-ui相关说明文档: manage-ui文档

• prometheus相关说明文档: prometheus文档

鸣谢

WebStorm - 感谢 JetBrains 团队提供的集成开发环境。

nuxt-blog's Issues

验证问题

请教下关于nuxt部署的一些问题

nuxt和koa都是用在同一个端口3000，部署后，会出现接口找不到或者跨域的问题，请问Nginx上要怎么配置吗？

比如项目路径是//服务端ip/pro/
没有做后端的时候页面是可以正常访问的。

做了后端之后，接口地址是服务端ip/api/ 但是总404.

我感觉应该是我nginx配置的问题：
部分Nginx配置如下：

# 项目配置
location /pro/ {
  proxy_pass http://127.0.0.1:3000;
 # 省略其他
}
# 接口的原来是没配的，发现没作用后配的，可实际也没啥作用= =
location /api/ {
 proxy_pass http://127.0.0.1:3000/api/;
}

还望指教 谢谢！

backpack dev的时候报错了，不支持webpack4吗，webpack版本是4.20

backpack dev

Module build failed: Error: Plugin/Preset files are not allowed to export objects, only functions. In E:\dir\nuxt-blog\nuxt\node_modules\backpack-core\babel.js at createDescriptor (E:\dir\nuxt-blog\nuxt\node_modules\@babel\core\lib\config\config-descriptors.js:178:11)

另外题外问个问题，为什么我自己建的demo，asyncData获取数据在组件渲染之后执行，数据没有注入到html里面
<div id="nuxt-loading" aria-live="polite" role="status"> <div>Loading...</div> </div>

翻页功能貌似无法再次服务端渲染，目前有方案否？

serviceUI 图片显示问题

图片上传后 在删除，图片链接依然存在且指向空的源文件地址。