第二章：源码环境搭建——Node.js、Java、数据库等依赖安装，前后端项目初始化与启动

说实话，搭建开发环境这事儿，看着简单，但坑是真不少。我见过太多人卡在这一步，代码还没写一行，先被环境折腾得想摔键盘。这一章，我就带你一步步把环境捋顺，咱们稳扎稳打地开始。

2.1 依赖清单：先搞清楚我们要装什么

在动手之前，咱们先看看这个低代码平台到底依赖哪些东西。我习惯先列个清单，心里有数再动手。

依赖项 版本要求 用途说明
Node.js ≥ 16.x LTS 前端项目运行环境，也是后端部分服务的运行时
Java JDK ≥ 11 (推荐 17) 后端核心服务，Spring Boot 全家桶
Maven ≥ 3.6 Java 项目构建与依赖管理
MySQL ≥ 8.0 主数据库，存储业务数据
Redis ≥ 6.x 缓存、会话管理、分布式锁
Git 最新稳定版 版本控制，拉取源码

重要提醒：版本一定要对齐。我在项目中遇到过因为 Node.js 版本太高导致某个依赖编译失败的情况，折腾了大半天才发现是版本兼容问题。建议就用表格里推荐的版本，别追新。

2.2 Node.js 安装与配置

前端部分跑在 Node.js 上，这是第一步。我个人习惯用 nvm（Node Version Manager）来管理 Node 版本，方便切换。

2.2.1 安装 nvm

Windows 用户去 GitHub 下载 nvm-windows 安装包。Mac 或 Linux 用户用命令行：

# Mac/Linux
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.3/install.sh | bash

# 安装完成后，重新打开终端，验证
nvm --version

2.2.2 安装指定版本的 Node.js

# 安装 16.x LTS 版本
nvm install 16.20.0

# 使用该版本
nvm use 16.20.0

# 验证
node -v   # 应该输出 v16.20.0
npm -v    # 应该输出 8.x 或 9.x

小技巧：安装完 Node 后，建议顺手把 npm 镜像源切换到淘宝源，不然下载依赖能等到你怀疑人生。

npm config set registry https://registry.npmmirror.com

2.3 Java 与 Maven 环境

后端是 Java 写的 Spring Boot 项目。嗯，这里要注意，JDK 版本别搞错了。

2.3.1 安装 JDK 17

去 Oracle 官网或者用 Adoptium（推荐）下载 JDK 17。安装完后配置环境变量：

# Windows 在系统变量里添加
JAVA_HOME = C:\Program Files\Java\jdk-17

# Mac/Linux 在 ~/.bashrc 或 ~/.zshrc 里添加
export JAVA_HOME=/Library/Java/JavaVirtualMachines/jdk-17.jdk/Contents/Home
export PATH=$JAVA_HOME/bin:$PATH

# 验证
java -version

2.3.2 安装 Maven

下载 Maven 二进制包，解压后配置环境变量：

# 配置 Maven 环境变量
export MAVEN_HOME=/path/to/apache-maven-3.9.0
export PATH=$MAVEN_HOME/bin:$PATH

# 验证
mvn -version

避坑指南：我曾经因为 Maven 的 settings.xml 里配置了错误的镜像源，导致项目依赖一直下载失败。建议你先把 settings.xml 里的 mirror 配置清空，等项目跑通了再按需配置。

2.4 数据库安装与初始化

这个低代码平台用 MySQL 做主库，Redis 做缓存。咱们先搞定 MySQL。

2.4.1 安装 MySQL 8.0

我用 Docker 来装，省心又干净。当然你也可以直接安装原生版本。

# 使用 Docker 启动 MySQL
docker run -d \
  --name lowcode-mysql \
  -p 3306:3306 \
  -e MYSQL_ROOT_PASSWORD=root123 \
  -e MYSQL_DATABASE=lowcode \
  mysql:8.0

# 验证连接
mysql -h 127.0.0.1 -u root -p

2.4.2 安装 Redis

# 使用 Docker 启动 Redis
docker run -d \
  --name lowcode-redis \
  -p 6379:6379 \
  redis:6-alpine

# 验证
redis-cli ping  # 应该返回 PONG

核心要点：数据库的字符集一定要设置为 utf8mb4，不然存不了表情符号。低代码平台里用户可能会在表单里输入各种特殊字符，这个坑我踩过。

2.5 拉取源码与项目结构

环境装好了，咱们来拉代码。假设你已经从 Git 仓库克隆了项目：

git clone https://github.com/your-org/lowcode-platform.git
cd lowcode-platform

项目结构大概是这样的：

lowcode-platform/
├── frontend/          # 前端项目 (Vue 3 + Vite)
│   ├── src/
│   ├── package.json
│   └── vite.config.js
├── backend/           # 后端项目 (Spring Boot)
│   ├── src/
│   ├── pom.xml
│   └── application.yml
├── docs/              # 文档
└── README.md

2.6 前端项目初始化与启动

先搞前端。进入 frontend 目录，安装依赖：

cd frontend
npm install

这个过程可能会有点慢，取决于你的网络。如果卡住了，看看是不是镜像源没配好。

安装完成后，启动开发服务器：

npm run dev

看到终端输出 Local: http://localhost:5173，说明前端跑起来了。打开浏览器访问一下，应该能看到登录页面。

个人经验：如果启动报错说某个模块找不到，别慌。先删掉 node_modules 和 package-lock.json，重新执行 npm install。八成能解决。

2.7 后端项目初始化与启动

后端稍微复杂一点，因为要连数据库。先配置数据库连接信息。

2.7.1 修改配置文件

打开 backend/src/main/resources/application.yml，修改数据库和 Redis 配置：

spring:
  datasource:
    url: jdbc:mysql://localhost:3306/lowcode?useUnicode=true&characterEncoding=utf8mb4&serverTimezone=Asia/Shanghai
    username: root
    password: root123
  redis:
    host: localhost
    port: 6379

2.7.2 初始化数据库表结构

项目里一般会带 SQL 初始化脚本。找到 backend/src/main/resources/db/migration 目录下的 SQL 文件，执行它们：

# 方式一：用 MySQL 客户端手动执行
mysql -u root -p lowcode < V1__init_schema.sql

# 方式二：项目启动时会自动执行（如果配置了 Flyway 或 Liquibase）

2.7.3 启动后端服务

cd backend
mvn clean install -DskipTests
mvn spring-boot:run

看到类似这样的日志，说明后端启动成功了：

2024-01-15 10:30:00.123  INFO 12345 --- [main] o.s.b.w.embedded.tomcat.TomcatWebServer  : Tomcat started on port(s): 8080 (http)
2024-01-15 10:30:00.456  INFO 12345 --- [main] c.l.LowcodeApplication                   : Started LowcodeApplication in 15.789 seconds

避坑指南：我曾经因为 MySQL 时区没配好，导致后端启动时报时区错误。解决办法是在数据库连接 URL 后面加上 serverTimezone=Asia/Shanghai。另外，如果 8080 端口被占用了，可以在 application.yml 里改端口。

2.8 验证前后端联通

前后端都启动后，咱们验证一下能不能正常通信。打开浏览器，访问前端地址 http://localhost:5173，在登录页面输入默认账号密码（一般在 README 里有说明）。

如果能正常登录并看到主界面，恭喜你，环境搭建成功了！

如果登录失败，打开浏览器开发者工具（F12），看看网络请求。如果请求后端接口报 404 或 500，检查后端日志，多半是数据库连接或 SQL 脚本没执行成功。

2.9 本章小结

这一章我们搞定了所有依赖的安装，也把前后端项目跑起来了。说实话，环境搭建是最枯燥的部分，但也是最重要的基础。后面的章节，咱们就要开始真正啃源码了。

下一章，我会带你深入前端核心模块，看看低代码平台的页面渲染引擎是怎么工作的。到时候你会发现，前面这些环境搭建的辛苦，都是值得的。

最后提醒一句：如果你在搭建过程中遇到任何问题，先看控制台报错信息，再 Google 一下。大部分坑都有人踩过，别自己硬扛。

公众号:蓝海资料掘金营，微信deep3321

← 上一章 📖 返回目录 下一章 →