这是我参与更文挑战的第22天，活动详情查看：更文挑战

前言

在和公司前端兄弟们交流时, 最大的诧异莫过于他们不知道Vue UI这个东西

在笔者刚开始接触Vue, 对于工程化前端完全摸不着头脑的时候, 可是它拯救了我的生命

特写本文章记录一下, 也算是帮助一些新人兄弟们上手更快速一些

创建项目

在windows下运行非常容易, 我们只需要按下Win+R打开运行, 输入vue ui后回车即可:

当然, 你必须全局安装了vue-cli: pnpm add --global @vue/cli

什么都不要操作, 等待vue运行成功后, 会自动打开web页面:

官方自带中文哦, 如果已有项目, 会是如下界面:

点击图中红框标出的内容就可以回到第一个页面啦

选择项目目录, Windows下会有些问题, 推荐直接粘贴复制

选定好目录后, 点击在此创建新项目:

填写项目名称, 选择包管理器, 这里推荐使用pnpm:

进入预设界面, 这里会有默认的项目设置和保存的手动配置, 例如图中的vue-2-js, 我们使用手动, 进入功能页面:

功能页面主要配置项目相关的内容, 例如Router, Vuex等, 详细的设置不再赘述, 需要的兄弟们可以去自行查询:

最后, 完成格式化配置, 点击创建, 一个崭新的vue项目就生成啦:

Vue UI在一定程度上方便了新手去创建vue项目

毕竟图形化操作比一堆文字要好理解的多嘛