vue-element-admin完整开源项目介绍、本地部署和初步探索

1 说明：

1.1 从一个广受好评的开源项目：vue-element-admin的本地化，来初步分析vue的相关知识。

1.2 提前安装：git、node、npm，本机查询结果：

git --version
#git version 2.11.0
 npm --version
#6.13.4
node --version
#v12.16.1

2 github地址和下载本地部署：

https://github.com/PanJiaChen/vue-element-admin

打开终端，非root的根目录下

git clone https://github.com/PanJiaChen/vue-element-admin.git
cd vue-element-admin
npm install  #这种安装报错，先按照下面的按照
npm install --registry=https://registry.npm.taobao.org --loglevel=silly
npm cache clean --force
npm install  #再从这里安装，就不会报错
npm run dev  #打开

说明：npm i=npm install

如果安装cnpm，也可以，但是据说经常报错，cnpm有时候用起来会有很多问题，无缘无故地安装些多余的东西。

建议npm i进行安装依赖，虽然有点慢。

3 自动弹出界面：

4 直接点击：login，进入即可

5 用微软vscode编辑器打开文件夹

6 自己可以根据已经开源的项目，进行局部修改进行vue的相关学习。

vue的结构的一般和大概了解。

├── build                      // 构建相关  
├── config                     // 配置相关
├── src                        // 源代码
│   ├── api                    // 所有请求
│   ├── assets                 // 主题 字体等静态资源
│   ├── components             // 全局公用组件
│   ├── directive              // 全局指令
│   ├── filtres                // 全局 filter
│   ├── icons                  // 项目所有 svg icons
│   ├── lang                   // 国际化 language
│   ├── mock                   // 项目mock 模拟数据
│   ├── router                 // 路由
│   ├── store                  // 全局 store管理
│   ├── styles                 // 全局样式
│   ├── utils                  // 全局公用方法
│   ├── vendor                 // 公用vendor
│   ├── views                   // view
│   ├── App.vue                // 入口页面
│   ├── main.js                // 入口 加载组件 初始化等
│   └── permission.js          // 权限管理
├── static                     // 第三方不打包资源
│   └── Tinymce                // 富文本
├── .babelrc                   // babel-loader 配置
├── eslintrc.js                // eslint 配置项
├── .gitignore                 // git 忽略项
├── favicon.ico                // favicon图标
├── index.html                 // html模板
└── package.json               // package.json

7 今日到此，下次学习。