项目简介
一个高仿小红书的图文社区项目，支持图文发布、社交互动等核心功能，旨在提供从前端到后端的完整实践范本
仓库地址
https://github.com/ZTMYO/XiaoShiLiu/
效果展示
视频教程
https://www.bilibili.com/video/BV14YyABYErT/?share_source=copy_web
1.演示的运行环境
nodejs v22.19.0
mysql 5.7
cnpm 9.4.0
npm 10.9.3
在宝塔nodejs管理器中安装
2.项目部署
文件下载
https://github.com/ZTMYO/XiaoShiLiu/archive/refs/heads/master.zip下载到 /www/wwwroot/ 目录下，然后解压
3.编辑后端配置
进入
/www/wwwroot/XiaoShiLiu-master/express-project目录下
找到
.env.example重命名为
.env
打开编辑
主要修改这个参数
DB_PASSWORD=数据库root密码
获取root密码
打开数据库，root的密码
粘贴过去就行
config.js 也一样
4.导入数据库
先下载数据库
点开高级设置，选择数据库备份，再选择本地上传
上传完成后恢复
5.启动后端
项目文件路径
/www/wwwroot/XiaoShiLiu-master/express-project启动命令
npm start包管理器
npm
后端就运行成功了
重命名前端配置
进入
/www/wwwroot/XiaoShiLiu-master/vue3-project.env.example
重命名为
.env
6.修改前端配置
/www/wwwroot/XiaoShiLiu-master/vue3-project/.env是否使用真实API，需要修改为false
# 是否使用真实API
VITE_USE_REAL_API=false
7.运行前端
项目目录
/www/wwwroot/XiaoShiLiu-master/vue3-project启动命令
npm run dev包管理器
npm端口
5173域名有的话就填域名，没有的话就填ip
成功搞定
8.其他
如果添加项目之后卡住并且刷新页面之后项目列表为空，这个问题应该宝塔bug，我们重新添加一次就好了
后台地址
/admin
默认用户名
admin密码
1234569.设置本地存储
编辑
/www/wwwroot/XiaoShiLiu-master/express-project/.env找到
# 本地存储配置
LOCAL_UPLOAD_DIR=uploads
LOCAL_BASE_URL=http://localhost:3001字段
把后面的localhost修改为你的后端ip
然后服务器打开3001端口
就好了
10.添加授权域名
/www/wwwroot/XiaoShiLiu-master/vue3-project/vite.config.js找到33行，取消注释然后添加允许访问的域名
格式
'xxx.cn',
'www.xxx.cn'末尾需要用英语的,
11. 域名访问白屏解决办法
打开前端网站配置
复制下面的规则替换30行，保存就好了
location ~* (\.user.ini|\.htaccess|\.htpasswd|\.env.*|\.project|\.bashrc|\.bash_profile|\.bash_logout|\.DS_Store|\.gitignore|\.gitattributes|LICENSE|README\.md|CLAUDE\.md|CHANGELOG\.md|CHANGELOG|CONTRIBUTING\.md|TODO\.md|FAQ\.md|composer\.json|composer\.lock|package(-lock)?\.json|yarn\.lock|pnpm-lock\.yaml|\.\w+~|\.swp|\.swo|\.bak(up)?|\.old|\.tmp|\.temp|\.log|\.sql(\.gz)?|docker-compose\.yml|docker\.env|Dockerfile|\.csproj|\.sln|Cargo\.toml|Cargo\.lock|go\.mod|go\.sum|phpunit\.xml|phpunit\.xml|pom\.xml|build\.gradl|pyproject\.toml|requirements\.txt|application(-\w+)?\.(ya?ml|properties))$
没有回复内容