vue-cli 3.0 版本为我们提供了集 创建、管理、分析 为一体的可视化界面vue UI，一个可视化项目管理器

一、打开终端，安装最新vue-cli

　　npm install -g @vue/cli

二、终端运行vue ui

　　vue ui

　　之后会自动跳转到http://localhost:8000,进入如下页面

三、三个标签，点击创建

　　1.填写项目名称、选择包管理器、是否初始化git

　　2.选择插件配置方式

　　3.选择手动配置项目将会进入这一步，可以选择插件进行安装配置，包括常用的router、vuex等

　　4.根据选择进入插件具体配置

四、点击创建项目，根据需要选择是否保存预设，以方便下一次直接创建

 五、等待片刻项目创建成功后8000跳转至如下页面，左侧列表可以查看并管理项目的依赖、插件、配置和运行命令

 六、最后打开项目，npm run serve运行就OK啦

Vue ui创建项目的更多相关文章

  1. vue-cli@3.x之使用vue ui创建项目-来自一个战五渣的体验

    1. 全局安装vue-cli yarn global add @vue/cli // 检查安装是否成功 vue -V // 3.2.2 2. 初始化 vue ui 执行命令 vue ui 2.1 该命 ...

  2. 初学Vue.js，用 vue ui 创建项目会不会被鄙视

    全栈的自我修养: 6使用vue ui进行vue.js环境搭建 It is only with the heart that one can see rightly. What is essential ...

  3. vue ui 创建vue项目 没反应的解决办法 2021

    1.升级vue 脚手架 即可   2.再  vue ui  创建项目 cnpm i -g @vue/cli

  4. 用vue ui创建的项目怎么关闭eslint校验

    在Vue Cli的控制面板找到配置-ESLint configuration,然后关闭保存时检查就可以了

  5. Vue.之.创建项目

    Vue.之.创建项目 第一次使用vue的时候,在已完成node的情况下,还需要在进行安装vue. 指令:cnpm install vue-cli -g      //全局安装 vue-cli 检查vu ...

  6. Vue CLI 创建项目

    使用命令创建VUE项目 运行以下命令[vue create [项目名]]来创建一个新项目: vue create hello-world 警告 如果你在 Windows 上通过 minTTY 使用 G ...

  7. 小白6步搞定vue脚手架创建项目

    1.安装node及npm node -v (测试node是否安装成功)npm -v(测试npm是否安装成功) 2.安装cnpm npm install -g cnpm --registry=http: ...

  8. Vue脚手架创建项目

    创建一个基于webpack模板的新项目 D:\Git $ vue -V D:\Git $ vue init webpack my-project ? Project name my-project ? ...

  9. Vue 安装环境创建项目

    vue 是一个单页面框架,基于模块化组件化的开发模式. 搭建开发环境之前必须要安装node.js,然后安装vue的脚手架工具(命令行工具)win + R 输入npm install  --global ...

随机推荐

  1. c#画图之柱形图

    public JsonResult DrawBarChart() { #region 允许配置项 //定义宽高 , width = ; //边缘位置留白 ; ; ; ; //辅助线距离顶部的距离 ; ...

  2. 什么是kafka,怎么使用? (3)

    上次我因为在windows上解压一个.gz的包没有解压出来,故需要在linux使用kafka,而且这kafka的快速开始上有个zookeeper的文件配置 所以我感觉有必要把dubbo-zookeep ...

  3. python函数的使用

    python函数的使用 制作人:全心全意 函数的定义 def 函数名(参数): 函数体 参数的使用 def 函数名(a): 函数体 函数名(5) 默认函数 def 函数名(a=5): 函数体 函数名( ...

  4. MySQL 8 备份与恢复

    备份应用的场景包括:系统崩溃.硬件故障.用户错误.升级MySQL Installation.传输MySQL Installation到另一台机器.设置复制等. Slave Server备份 在备份Sl ...

  5. Spring Boot源码（六）：Bean的创建详解

    继续之前的项目: People加上无参构造方法: @Component public class People { // private User user; public People(){ Sys ...

  6. c++ 浮点数小数位

    . double f = 3.123456789; . cout<<f<<endl; // 输出3.12346 (包含整数和小数,且四舍五入) . cout<<se ...

  7. pads无模命令

    W<n>………改变线宽,比如 30. 栅格(Grids) G<xx>………过孔和设计栅格设置.GD<xx>………显示栅格设置.GP………打开或关闭极性栅格.GP r ...

  8. php ftp 使用 以及 php_connect_nonb() failed: Operation now in progress (115)

    设置 ftp_pasv($conn,true);  会出现下面错误   不设置 调用ftp 连接没问题  ftp_nlist  ftp_put ftp_get 等函数都不成功 ftp_nb_fput( ...

  9. Python_3

    """ Function_1: 寻找水仙花数. 水仙花数也被称为超完全数字不变数.自恋数.自幂数.阿姆斯特朗数, 它是一个3位数,该数字每个位上数字的立方之和正好等于它本 ...

  10. API接口幂等性设计

    目录 幂等性场景 解决方案 幂等性场景 网络延迟导致多次重复提交. 表单重复提交. 解决方案 每次提交都使用一个Token,Token保证临时且唯一即可 token生成规则(单机应用):token+U ...