网站建设实训总结及体会,做网站准备什么软件,新彊生产建设兵团网站,烟台网站推广谷粒商城09——人人开源框架的快速入门
前言#xff1a;这个系列将使用最前沿的cursor作为辅助编程工具#xff0c;来快速开发一些基础的编程项目。目的是为了在真实项目中#xff0c;帮助初级程序员快速进阶#xff0c;以最快的速度#xff0c;效率#xff0c;快速进阶…谷粒商城09——人人开源框架的快速入门
前言这个系列将使用最前沿的cursor作为辅助编程工具来快速开发一些基础的编程项目。目的是为了在真实项目中帮助初级程序员快速进阶以最快的速度效率快速进阶到中高阶程序员。
本项目将基于谷粒商城项目并且对谷粒商城项目进行二次重构使其满足最新的主流技术栈要求。
这篇文章主要介绍人人开源框架的快速入门使用它快速搭建项目后台。后面下篇文章考虑使用若依重构。敬请期待。
1、人人开源框架简介
人人开源Renren Open Source是一个专注于Java开发的开源社区提供一系列旨在提高开发效率、降低开发成本的开源项目。这些项目涵盖权限管理、快速开发平台、代码生成等多个方面帮助开发者快速构建和部署应用。
我们将借助它来实现我们后台管理系统的快速搭建。 至于里面各个项目的详细介绍可以自行了解。
网址https://gitee.com/renrenio
2、后端导入
我们今天使用的是renren-fast和renren-fast-vue分别来搭建后端、前端。
clone下代码。 将后端的.git删除。 将其整个拖到我们之前建立的guilimall后端工程文件夹下面。 在项目结构目录下导入这个项目模块。 同样的把前端的git目录删除。我们后面再讲解前端部分。
先在idea中将工程的pom文件进行下更新。 renren子模块的pom文件也需要修改下。避免项目使用jdk版本导致兼容问题和你项目中jdk版本保持一致即可。 打开navicat连接我们前面创建的数据库执行下面sql。当然实际上我们前面一篇学习数据库设计已经执行过了所以这里就不用重复执行了。 更改下数据库配置先看application.yml。默认使用的是dev环境。 更改下数据库配置信息。将其替换为你自己创建的数据库。 idea编辑器可能出现如下报错
Some problems were encountered while building the effective model for org.springframework.boot:test01:jar:2.4.0
parent.relativePath of POM org.springframework.boot:test01:2.4.0 (E:\JavaWeb_base\springbootTest\test01\pom.xml) points at com.ltb:springbootTest instead of org.springframework.boot:spring-boot-starter-parent, please verify your project structure line 7, column 13
It is highly recommended to fix these problems because they threaten the stability of your build.
For this reason, future Maven versions might no longer support building such malformed projects.解决办法在该模块的pom文件中在parent标签中加上relativePath /
parentgroupIdorg.springframework.boot/groupIdartifactIdspring-boot-starter-parent/artifactIdversion2.4.0/versionrelativePath /
/parent如果项目出现大量爆红开源reload下maven project。清理idea缓存重新打开项目。
启动项目成功了。 访问下项目吧。okk这样就可以了。 3、运行前端项目
使用vscode打开前端项目。
需要具有node环境我们前面文章早就教过了这里不再赘述了。没有的同学自己安装。
执行命令。 发现报错。 出现报错看错误信息是需要环境中python。
安装一个。记得添加到环境变量。如果自动安装报错可以去官网下周zip包解压手动添加导PATH环境变量。
安装官网https://www.python.org/downloads/windows/ 测试下。 关闭vscode重新打开在vscode终端也测试下确保能找到python。
重新执行pnpm install报错。错误信息如下。 从错误信息来看node-gyp 无法找到合适的 Visual Studio 安装来编译原生模块。这是因为 node-gyp 需要 Visual Studio 的 C 构建工具来编译某些依赖项。
下周安装https://visualstudio.microsoft.com/zh-hans/visual-cpp-build-tools/ 在安装过程中确保勾选以下组件 可能会弹窗需要重启电脑。那你就按提示重启电脑再安装。 再执行发现还是不行。
仔细观察错误信息
gyp ERR! UNCAUGHT EXCEPTION
│ gyp ERR! stack TypeError: Cannot assign to read only property cflags of object #Object
│ gyp ERR! stack at createConfigFile (C:\Users\半旧\Desktop\wz\javawrokspace\renren-fast-vue\node_modules\.pnpm\node-gyp7.1.2\node_modules\…
│ gyp ERR! stack at process.processTicksAndRejections (node:internal/process/task_queues:85:11)
│ gyp ERR! System Windows_NT 10.0.26100
│ gyp ERR! command C:\\Program Files\\nodejs\\node.exe C:\\Users\\半旧\\Desktop\\wz\\javawrokspace\\renren-fast-vue\\node_modules\\.pnpm\\nod…
│ gyp ERR! cwd C:\Users\半旧\Desktop\wz\javawrokspace\renren-fast-vue\node_modules\.pnpm\node-sass6.0.1\node_modules\node-sass
│ gyp ERR! node -v v22.14.0
│ gyp ERR! node-gyp -v v7.1.2
│ gyp ERR! Node-gyp failed to build your package.
│ gyp ERR! Try to update npm and/or node-gyp and if it does not help file an issue with the package author.
│ Build failed with error code: 7核心问题
Node.js 版本过高 你使用的 Node.js v22.14.0 已超出 node-sass6.0.1 的兼容范围。node-sass 官方明确表示其最高仅支持到 Node.js 16。
node-gyp 配置冲突 错误 Cannot assign to read only property cflags 表明 node-gyp 在生成构建配置时遇到权限或语法冲突可能与高版本 Node.js 的模块加载机制不兼容有关。
Windows 编译工具链缺失 node-sass 需要 Visual Studio Build Tools 和 Python 2.x 支持但新版本 Node.js 默认不再集成这些工具。
1开代理。进行如下操作,降级 Node.js 至兼容版本
# 安装 nvm-windows需管理员权限
choco install nvm
# 安装并切换到 Node.js v16
nvm install 16.20.2
nvm use 16.20.2验证环境
node -v # 应显示 v16.x.x
npm -v # 应显示 6.x.x 或 8.x.x(2). 替换 node-sass 为 sass
node-sass 已弃用建议改用官方推荐的 sassDart Sass
卸载旧依赖
npm uninstall node-sass安装 sass
npm install sass --save-dev修改项目代码 将所有 node-sass 的引用替换为 sass例如在 Webpack 或 Vue CLI 配置中。
3. 安装 Windows 编译工具链
若仍需使用 node-sass需补充环境依赖
安装 Visual Studio Build Tools网页1、网页4
勾选「Desktop development with C」工作负载。安装 Python 3从 Python 官网 下载。
配置环境变量
npm config set python C:\Python313\python.exe
npm config set msvs_version 2022npm install没有报错. 咱们接下来运行下这个项目。
npm run dev没有问题。 还挺漂亮的。 4、前后端联调
启动后端会出现验证码。点击验证码。 验证码刷新后端会接收到请求消息。 默认管理员账户admin/admin登录。 好的你自己玩玩吧。这节就介绍到这里。后面两节我可能考虑补充下node和npm的知识。也可以考虑使用若依来替换人人开源框架如果你有这方面的需求。可以评论区留言。
