【一】 环境搭建. vue3 + ts + element-plus 项目实战 (后台管理系统)

523 阅读2分钟

1 安装node js

 1 进入 node 官网下载,https://nodejs.org/  然后一路安装 。
  安装好后 

安装后,查看node 版本和npm 版本

2 npm 设置镜像

cmd >   npm config set registry http://registry.npm.taobao.org/ 

在这里插入图片描述

3 使用vite2 创建项目

cmd > npm create vite  
#然后按提示操作

在这里插入图片描述 在这里插入图片描述

###4 访问页面。并安装devtools . (这里懒得翻墙,找下载包,就直接用firefox 安装扩展了) 在这里插入图片描述

总结: 具体操作没啥好说的,照文档搬砖, vue3 大势所趋,vite 是真的快。 setup 语法糖是真香。

写在开篇

** 1 本系列blog用于记录使用vue + ts + element plus 实现一个后台管理系统。 (预计含用户管理 ) + rbac + 配置管理 ,基础数据crud 等 。

2 我会忽视一些细节 ,以做工程项目的思路去写blog, 能简单实现的,就不展开过多bb. 例如,关于vuex 的使用,在最简使用时,你只要会 设置 state 和mutation ,在调用时会 读数据,会调commit 方法即可,还有,script setup 语法糖提供了优化,就不再按composition api 的原写法去折腾了, 没有必要将注意力和记忆力过度的消耗在那些乱七八糟的引入如何写这些事情上。(拿例子复制粘贴) 再小改即可。 当现有需求无法满足时,再去查文档做深入处理。(硬要为上述说辞找个原则的话,简单实现,就是如无必要,不瞎折腾)

3 我会持续的折腾一些细,工程项目与学生过家家的最大不同是其面对的业务规模,可维护性等,例如将意图与实现分离,让代码更好理解。例如遵守 dry ,fail fast 原则,使用 solid 原则更好的组织代码等 。 原因无它,这里面的部分代码,可能我在后续接项目时,会直接用到。 `**