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. js , forEach 用法

    person.forEach((item,index) => { console.log( item.id ); if( id == item.id ){ item.is_selected = ...

  2. StarUML之六、StarUML规则与快捷键

    本章内容参考官网即可,不做详细说明,实践出真知! starUMl规则主要是在模型设计的约束条件 https://docs.staruml.io/user-guide/validation-rules ...

  3. C++ Primer 抄书笔记(二)——变量和基本类型(上)

    一.基本内置类型 base build-in type[算数类型/类型转换/字面值常量] 基本内置类型(算数类型arithmetic type(整型integral type(字符,布尔bool),浮 ...

  4. 常用Content-type对照表

    文件扩展名 Content-type .html text/html .xhtml text/html .gif image/gif .png image/png .jpg image/jpeg 更加 ...

  5. SpringBoot从1.5.1→2.2.4项目加包扫雷二:打不到符号java: org.springframework.boot.autoconfigure.web.相关配置错误支持包

    import org.springframework.boot.autoconfigure.web.DefaultErrorAttributes→org.springframework.boot.we ...

  6. 方法(定义、调用、重载)—Java

    一. 什么是方法 不可能所有的功能都放到main中,需要定义其他方法完成指定功能,需要时调用方法即可 封装在一起来执行操作语句的集合,用来完成某个功能操作 封装在一起来执行操作语句的集合,用来完成某个 ...

  7. Redis的主从复制与Redis Sentinel哨兵机制

    1    Redis的主从复制 1.1   什么是主从复制 持久化保证了即使redis服务重启也不会丢失数据,因为redis服务重启后会将硬盘上持久化的数据恢复到内存中,但是当redis服务器的硬盘损 ...

  8. 使用这7个隐藏技巧让您的Mac更易于阅读和使用!

    macOS Mojave(10.15)可以说是苹果公司功能最强大,功能最强大的现代Mac软件更新版.它带来了一系列新功能,安全和隐私控制,稳定性增强以及Dark Mode主题! 它也代表了最易于使用的 ...

  9. matplotlib调整子图大小

    因为子图太多而导致每个子图很小,很密,如何调整

  10. python三器

    1.1 装饰器 1.装饰器的作用 1. 装饰器作用:本质是函数(装饰其他函数)就是为其他函数添加其他功能 2. 装饰器必须准寻得原则: 1)不能修改被装饰函数的源代码 2)不能修改被装饰函数的调用方式 ...