基于图形化界面创建Vue项目

原创 已于 2022-05-06 17:02:02 修改 · 4.2k 阅读 · 18 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#vue.js

于 2022-03-19 23:20:45 首次发布
本文详述了如何在Node.js环境下通过Vue图形化界面创建Vue项目，包括使用VueUI、配置预设、选择功能、安装插件等步骤，并提供了创建vue.config.js和.postcssrc.js配置文件的示例，以及常用npm指令。同时，文章还介绍了如何保存预设和安装依赖，以便快速构建项目。

记录：267

场景：基于图形化界面创建Vue项目，便于后续查阅。

环境：Node.js v14.17.3

1.打开cmd控制台

运行命令：vue ui

截图：

 

2.项目仪表盘

截图：

3.Vue 项目管理器-项目

截图：

4.Vue 项目管理器-创建

截图：

最低0.47元/天 解锁文章
图形化方式利用脚手架创建Vue项目
qq_42416602的博客
01-28 1497
5 选择Babel、Router、Linter/Formatter和使用配置文件，点击下一步。默认，选择配置文件方式 In dedicated config files，回车。回车，CSS选择Sass/SCSS(with node-sass)，回车。按空格键选择Babel、PWA、Router、Vuex、CSS，回车。10 选择任务/serve，点击运行，等待编译成功，点击启动app。4 router中的index.js删除Home.vue导入语句。16 重新启动项目，出现el-button，则安装成功。
vue图形化的方式创建项目
weixin_47906106的博客
02-16 524
首先要保证安装了vue npm install @vue/cli -g 使用图形化的方式创建项目 vue ui 不设置预设 安装elementui插件 安装axios 启动项目
Vue基础教程（158）精通Vue CLI和Vite之创建项目中的使用图形化界面：摸鱼也能搞定！Vue CLI和Vite图形化界面真香指南，零命令行恐惧症福音
最新发布
jxf_jxfcsdn的博客
10-04 768
还在黑乎乎的命令行里敲代码？Vue CLI UI和Vite图形化界面让你用戳戳点点完成项目创建！本文深度对比两款工具的图形化使用，从安装到插件配置全程图解，附完整购物车项目示例，256字看完就能上手，效率直接翻倍！
【前端环境3】已有代码配置vue环境 + 使用 vue ui 图形化界面创建vue项目 + vue项目目录结构
定期分享我的发现和想法，感谢你的陪伴和支持
07-02 2643
使用 vue ui 图形化界面创建 vue 项目是一种方便的方式，可以直观地操作和查看项目的配置和依赖。
如何用vue图形化界面创建项目
a486368464的博客
12-05 557
如何用vue图形化界面创建项目
基于图形化界面的方式创建vue2项目
fantasyfzg的博客
12-28 728
vue
基于图形化界面的方式创建Vue-cli项目
weixin_43360890的博客
05-29 751
Vue-cli的安装搭建- -基于图形化界面的方式 基于图形化界面的方式（网页），搭建新版vue项目。 cmd中运行vue ui，打开图形化界面（会自动打开一个网页）。 1. 点击创建，选择项目创建文件夹后，点击再次创建新项目。 2. 输入项目文件夹名称，Git填写init project 初始化项目 3. 开始预设的配置，我们手动配置预设。 4. 选择需要配置的预设 这里我们选择最基本的Belel，Router，Linter / Formatter预设和使用配置文件（将插件的配置保存在各自的配
【Vue】Vue全家桶（八）vue-cli脚手架 +图形可视化创建Vue项目+命令行创建Vue项目
Better_Xing的博客
06-04 1298
【Vue】Vue全家桶（八）vue-cli脚手架 +图形可视化创建Vue项目+命令行创建Vue项目
@vue/cli4--使用图形化界面创建项目--方法/实例
IT利刃出鞘的博客
06-22 2022
本文用实例来介绍vue-cli4如何使用图形化界面来创建项目。
图形化创建vue项目
u011744300的专栏
09-18 543
上一篇写了快速创建vue项目，vue也提供了图形化界面创建和管理项目。 vue ui 执行完成后，会出现如下页面： 点击创建，就可以创建项目了。 按照提示创建就可以了。 ...
Vue UI：Vue开发者必不可少的工具
LuckXinXin的博客
10-09 774
Vue开发工具越来越好用了！ 随着最新的稳定版本Vue CLI 3即将发布，是时候来看看有什么新鲜有趣的特性了。基于整个Vue.js开发者社区的反馈而大幅度改良，该版本提供了很多以工作流为中心的工具。 我想会提升每一位Vue.js的开发者工作效率的特性就是Vue UI。一个可视化图形界面方便你去创建、更新和管理项目的方方面面。 今天，我会跟你一一介绍Vue UI的beta版本中可用的功能。 开始 首先，我们确保安装了最新的Vue CLI。打开cmd，输入： npm install -g @vue/cl.
利用vue图形界面创建一个vue项目
m0_70484213的博客
06-16 440
这种方式适合那些只想确保代码没有错误，而不关心代码风格一致性的开发者或项目。相关的依赖，它们能够协助开发者遵循良好的编码规范，确保整个项目代码的整洁性和一致性，有助于提高代码质量，减少因格式问题或潜在代码缺陷引发的错误和故障，是 Vue 开发中常用的辅助工具之一。是一个 JavaScript 编译器，主要用于将采用 ECMAScript 2015+ 语法编写的代码转换为向后兼容的 JavaScript 语法，以便能够在旧版浏览器或其他环境中运行。在创建 Vue 项目时，可以选择添加。
基于 图形化界面 的方式，创建 新版 vue 项目
weixin_44549096的博客
02-09 460
基于 图形化界面 的方式，创建 新版 vue 项目 1、使用 vue ui 打开 图形化页面 2、选择存放项目的目录 3、创建新的项目 4、询问是否进行相关的配置 5、选择功能 6、选择配置 7、是否将刚选择的配置，保存为模板 8、创建成功后 9、点击 ‘下拉框’中的 ‘Vue项目管理器’ ，查看所有创建的项目 10、查看插件、依赖、配置 11、运行项目 点击 ‘运行’，项目进行编译 等 序号3 加载成功后 点击 ‘启动app’ 1
Vue的图形化界面创建项目
前端小攻城狮的博客
12-07 465
首先.检查自己的vue-cli版本，有没有安装脚手架 一．命令行创建 Cmd=>vue ui 访问http://localhost:8000/ 二．选择目录 三．初始化git（可不选择） 我填的是Init project，也可以不用 四．预设（手动） 3个必选1.Babel;2.router;3.Linter/Formatter; 点击下一步 五．关闭:use historyrouter ESLint+Standard config Lint on save 六．是否保存预设（我选择否） 正在创建，等
vue ui 使用图形化界面
aaronthon的博客
05-15 1745
你也可以通过vue ui命令以图形化界面创建和管理项目： vue ui 上述命令会打开一个浏览器窗口，并以图形化界面将你引导至项目创建的流程。 ...
创建vue项目
zeroone的博客
11-02 841
使用图形页面和命令行形式新建vue项目
vue ui Starting GUI 图形化配置web新项目
通达的博客
03-06 1398
在vue框架里面， 以往大家都是习惯用命令行 vue create 、vue initwebpack创建新前端项目，而vue ui是一个可视化的图形界面，对于新手来说更加友好了，不但可以创建、管理、还可以更新vue项目，也可以下载各种需要的插件，比如elmentui、axios、vuex等，图形化更加直观的看到所安装的各种插件以及一来，安装卸载不用敲命令，一键即可，下面就来介绍，如何使用ui创建新项目。
vue 使用图形向导来创建 vue 项目
weixin_49107940的博客
03-12 384
vue2创建项目
基于可视化创建一个vue3项目
12-27
为了通过可视化界面创建 Vue 3 项目，需确保已安装 Node.js 和 Vue CLI。以下是具体操作流程： #### 打开命令行并启动可视化界面 在目标文件夹路径下打开命令提示符（可通过视窗键+R 输入`cmd`实现），随后输入 `...
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值