【学习备忘录】ele项目的环境配置

一. 前端配置（简略版）

1 下载一些工具

1. 打开 cmd （以管理员身份打开，否则之后安装库时会失败）
2. 从命令行进入 ele-ui 目录下
3. 安装 cnpm 命令为：npm install -g cnpm --registry=https://registry.npm.taobao.org
4. 安装 yarn 命令为：cnpm install -g yarn
5. 确保当前命令行处于 ele-ui 目录下的情况下，下载项目所有的依赖，命令如下：yarn install
6. 依赖下载成功后，运行服务器，命令如下：yarn run dev
7. 等待片刻后，服务器成功打开效果如下：

8. 再在浏览器打开登录网页，url 如下：http://localhost:3000/login
9. 能够成功显示界面即为成功，此时页面中没有验证码，并不能进行任何操作，后面的操作得在后端配置也完成后方可进行

二. 后端配置

1 配置 mysql （做到配置完mysql即可，博客后面的配置连接数据库不用继续操作，直接看下面步骤2中的操作即可）

• 配置教程博客

2 配置数据库连接工具 Navicat Premium

• 配置教程博客

3 使用 Navicat Premium 连接 mysql

1. 新建连接
   

2. 填入连接名、密码（该密码为配置mysql时更改后的密码）
   

3. 右键创建的连接并选择新建数据库
   

4. 填入如下信息（其中数据库名来自ele-boot项目中的配置文件信息）

• 数据库名来源（此步骤只作为解释，可忽略）
  

5. 右键点击ele-admin-api数据库的查询选项，并选择打开外部查询
   

6. 路径选择为ele文件夹中的数据库脚本中的sql文件（注意：这里后面 徐传运 更改了脚本文件，请下载群里最新的 ele-admin-api1.sql ）
   

7. 接着我们在IDEA中打开ele后端项目文件 ele-boot（没有右键打开方式的可先启动IDEA，再打开项目文件）
   

8. 打开项目文件后，进入 EleAdminApplication 文件，右上角会提示缺少包，点击下载即可
   
   

9. 下载完成后，进入sources目录下，并依次修改3个.yml配置文件中的密码，即将password后面的内容修改为 配置mysql步骤 中修改后的数据库密码（注意3个配置文件都要修改哦）
   
   

10. 然后回到 Navicat Premium 中，点击运行之前打开的查询语句
    

11. 接着再次回到 IDEA 中，运行后端程序 EleAdminApplication
    

12. 最后在网页中再次打开 http://localhost:3000/login ，会出现验证码，进行登录后成功界面如下（注意此时应检查命令行中的服务器是否依然处于运行状态）：
    
    服务器运行截图：
    

13. 如果显示效果如上，便证明此次 ele 项目的前后端配置完成