element admin 动态路由_vue-element-admin完整开源项目介绍、本地部署和初步探索

1 说明:

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

d54e4b8a468b58fc38e48727dc1b0a11.png

1.2 提前安装:git、node、npm,本机查询结果:

git --version#git version 2.11.0 npm --version#6.13.4node --version#v12.16.1
0d53d0ad25d4a7f132a072d87a07a823.png

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

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

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

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

说明:npm i=npm install

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

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

3 自动弹出界面:

31a92d46f7423ea3f0dd248c73ee1590.png

4 直接点击:login,进入即可

2c6737190d445cad4dbcf2bc5a57baf1.gif

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

e1c0dc1d5ad797f29ec1417bc22d0bad.gif

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 今日到此,下次学习。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值