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. 网页延迟加载动画的实现-WOW.js

    网页内容一开始不显示,随着鼠标下拉延迟显示,还有时间差 一开始觉得好难好复杂好高大上,直到我发现 wow.js …… 首先是演示地址:https://www.delac.io/wow/ 嗯,狗子确实很 ...

  2. 记一次Postgres CPU爆满故障

    问题描述 公司项目测试环境调用某些接口的时候,服务器立即崩溃,并一定时间内无法提供服务. 问题排查 服务器配置不够 第一反应是服务器需要升配啦,花钱解决一切!毕竟测试服务器配置确实不高,2CPU + ...

  3. include 和require 区别

    include和require的区别  1.include() 包含文件 2.include_once(filename)如果已经包含,则不再执行include_once 3.requirerequi ...

  4. C++ 实现string转BYTE

    用于将形如"0x1A"的string转成BYTE类型 代码如下, 有问题欢迎指出 bool str2byte(const std::string &str, BYTE &a ...

  5. #《Essential C++》读书笔记# 第七章 异常处理

    基础知识 异常处理机制有两个主要成分:异常的鉴定和发出,以及异常的处理方式.通常,不论是membe function和non-member function,都有可能产生异常以及处理异常.异常出现后, ...

  6. Tomcat 项目部署、账户配置、状态监测

    tomcat部署项目 方式一.自动部署(最常用) 直接把war包或部署的文件夹放到webapps下. tomcat启动后会自动监听webapps下的文件|目录,放入打包好的项目会自动部署,移除打包好的 ...

  7. 这 100 道 Python 题，拿去刷！！！

    2020年,学 Python 还有价值吗? 根据 2020 年 2 月的 TIOBE 编程语言排行榜显示,Python仍然稳居第三位. 此排行榜排名基于互联网上有经验的程序员. 课程和第三方厂商的数量 ...

  8. Python之一、#!/usr/bin/python到底是什么意思

    引用https://www.cnblogs.com/furuihua/p/11213486.html 关于脚本第一行的 #!/usr/bin/python 的解释,相信很多不熟悉 Linux 系统的同 ...

  9. Dev-C++如何创建源代码模板？

    Dev-C++如何创建源代码模板? 预览图片 按下Ctrl+N或者点击新建源代码,就会自动出现这些代码了 以下是操作步骤 编写你的模板 这里有我的样例: #include<iostream> ...

  10. 【新人赛】阿里云恶意程序检测 -- 实践记录 11.24 - word2vec模型 + xgboost

    使用word2vec训练词向量 使用word2vec无监督学习训练词向量,输入的是训练数据和测试数据,输出的是每个词的词向量,总共三百个词左右. 求和:然后再将每行数据中的每个词的词向量加和,得到每行 ...