# 安装要求
*****
1. composer
2. git
3. node.js
# 开发工具
*****
1. PhpStorm （PHP开发工具）
2. VScode （前端开发神器）
# 安装ThinkPHP6.0
*****
* 环境要求：PHP >= 7.1
* ThinkPHP6.0安装命令：
~~~
composer create-project topthink/think demo（项目名称）
~~~
* 目录（主要列出app和config目录）：
```
├─app 应用目录
│ ├─common 公共目录（新增） # 主要存放公共基础类
│ ├─controller 控制器目录
│ ├─middleware 中间件 （新增）
│ ├─model 模型目录 （新增）
│ ├─service 服务目录 （新增） # 服务类，数据操作
│ ├─utils 工具类目录 （新增） # 工具类，jwt等工具类
│ ├─validate 验证器目录 （新增） # 验证数据
│ ├─common.php 公共函数文件
│ └─event.php 事件定义文件
│
├─config 配置目录
│ ├─app.php 应用配置
│ ├─cache.php 缓存配置
│ ├─console.php 控制台配置
│ ├─cookie.php Cookie配置
│ ├─database.php 数据库配置
│ ├─filesystem.php 文件磁盘配置
│ ├─lang.php 多语言配置
│ ├─log.php 日志配置
│ ├─middleware.php 中间件配置
│ ├─route.php URL和路由配置
│ ├─session.php Session配置
│ ├─trace.php Trace配置
│ └─view.php 视图配置
│ ......
```
## 启动ThinkPHP6.0本地服务：
* 安装结束后用PhpStorm打开ThinkPHP6.0项目，在PhpStorm终端中执行：
```
php think run
```
* 启动成功返回：
```
ThinkPHP Development server is started On <http://127.0.0.1:8000/>
```
* 浏览器打开 [http://127.0.0.1:8000](http://127.0.0.1:8000)，出现以下页面则ThinkPHP6.0服务启动成功
# 安装vue-element-admin
*****
* 通过git方式安装：
~~~
git clone https://github.com/PanJiaChen/vue-element-admin.git
~~~
* 目录：
~~~
├── build # 构建相关
├── mock # 项目mock 模拟数据 （本地数据，可删除）
├── plop-templates # 基本模板
├── public # 静态资源
│ │── favicon.ico # favicon图标
│ └── index.html # html模板
├── src # 源代码
│ ├── api # 所有请求
│ ├── assets # 主题 字体等静态资源
│ ├── components # 全局公用组件
│ ├── directive # 全局指令
│ ├── filters # 全局 filter
│ ├── icons # 项目所有 svg icons
│ ├── lang # 国际化 language
│ ├── layout # 全局 layout
│ ├── router # 路由
│ ├── store # 全局 store管理
│ ├── styles # 全局样式
│ ├── utils # 全局公用方法
│ ├── vendor # 公用vendor
│ ├── views # views 所有页面
│ ├── App.vue # 入口页面
│ ├── main.js # 入口文件 加载组件 初始化等
│ └── permission.js # 权限管理
├── tests # 测试
├── .env.xxx # 环境变量配置
├── .eslintrc.js # eslint 配置项
├── .babelrc # babel-loader 配置
├── .travis.yml # 自动化CI配置
├── vue.config.js # vue-cli 配置
├── postcss.config.js # postcss 配置
└── package.json # package.json
~~~
## 启动vue-element-admin本地服务
*****
* VScode打开vue-element-admin项目，在终端中执行以下命令安装依赖
```
npm install
```
* 安装结束后执行以下命令开启本地服务
```
npm run dev
```
* 启动成功后返回
```
App running at:
- Local: http://localhost:9527/
- Network: http://192.168.3.6:9527/
```
* 浏览器会自动打开登录页面，出现以下登录页面vue-element-admin服务启动成功
