使用vue ui工具来创建vue项目(IDEA)

1.下载node.js

首先我们上node.js官网,

下载最新的长期版本,直接运行安装完成之后,我们就已经具备了node和npm的环境

2.检查是否安装成功

3.安装vue环境

# 安装淘宝npm
npm install -g cnpm --registry=https://registry.npm.taobao.org
# vue-cli 安装脚手架依赖包
npm install -g @vue/cli
或
yarn global add @vue/cli
# 打开vue的可视化管理工具界面(在想要创建vue项目的文件夹下cmd输入)
vue ui

4.创建vue项目

我们将在这个页面完成我们的前端Vue项目的新建。然后切换到【创建】,注意创建的目录最好是和你运行vue ui同一级。这样方便管理和切换。

然后点击按钮【在此创建新项目】下一步中,项目文件夹中输入项目名称,其他不用改。
注意这里不能勾选初始化git

注意这里不能勾选初始化git
点击下一步,选择【手动】,再点击下一步,如图点击按钮,勾选上路由Router、状态管理Vuex,去掉js的校验。

下一步中,也选上【Use history mode for router】,点击创建项目,然后弹窗中选择按钮【创建项目,不保存预设】,就进入项目创建啦。

稍等片刻之后,项目就初始化完成了。上面的步骤中,我们创建了一个vue项目,并且安装了Router、Vuex。这样我们后面就可以直接使用。

  • Router: WebApp的链接路径管理系统,简单就是建立起url和页面之间的映射关系

  • Vuex: 一个专为 Vue.js 应用程序开发的状态管理模式,简单来说就是为了方便数据的操作而建立的一个临时” 前端数据库“,用于各个组件间共享和检测数据变化。

vue ui工具来创建vue项目(IDEA)相关推荐

  1. 安装uve-cli,并使用vue ui可视化界面创建第一个vue项目

    安装vue-cli,并使用vue ui可视化界面创建第一个vue项目 下载vue-cli ,因为国内下载镜像比较慢,使用阿里的镜像仓库 npm install -g cnpm --registry=h ...

  2. vue ui 可视化界面 创建项目 报错:command failed: yarn --json。。。。。

    清除npm缓存 npm cache clean --force 然后重新启动 vue ui,这次创建项目成功了

  3. 【Vue工程】001-Vite 创建 Vue-TypeScript 项目

    [Vue工程]001-Vite 创建 Vue-Ts 项目 文章目录 [Vue工程]001-Vite 创建 Vue-Ts 项目 一.环境 二.创建项目 1.pnpm 创建 Vite 项目 2.设置项目名 ...

  4. 终端输入vue ui没反应---使用vue ui出现的四个问题

    问题1: 终端使用vue ui 无反应,而且工具列表没有ui操作, 既无法使用vue ui来创建项目 原因: vue版本问题,卸载原来的vue版本,然后重新安装 vue -h 查看帮助信息,没有vue ...

  5. Vue学习笔记一 创建vue项目

    1:安装Node.js Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境.可以搜索Node.js的官网下载,安装完成后,打开命令提示符cmd.exe,输入node ...

  6. 基于vue cli 3.0创建前端项目并安装cube-ui

    前提条件: 安装node.js. 国内的开发者最好先配置淘宝镜像. 之后用cnpm来代替npm命令. 项目创建过程: 打开cmd,输入命令进入目标工作空间,以本机项目为例: cd /d d: cd D ...

  7. 【移动端vue ui框架学习】vue项目如何使用基于vue的UI框架mint ui

    看了下饿了么团队开发的PC端vue ui框架Element ui之后,顺便看了看同团队开发的移动端的vue ui框架mint ui,那么在vue项目中应该如何使用mint ui呢?以下做简单的记录. ...

  8. 【PC端vue ui框架学习】vue项目如何使用基于vue的UI框架Element

    看了下iView之后,顺便看了看同样基于vuejs的ui框架Element,那么在vue项目中应该如何使用Element呢?以下做简单的记录. 官网定义:Element,一套为开发者.设计师和产品经理 ...

  9. 【PC端vue ui框架学习】vue项目如何使用基于vue的UI框架iview

    今晚看了一下基于vuejs的ui框架iview,感觉UI挺好看的,那么在vue项目中应该如何使用iview呢?以下做简单的记录. 首先安装iview: $ npm install iview --sa ...

最新文章

  1. SAP RETAIL MM42维护商品采购信息记录数据的缺陷
  2. 清华大学全面审查文科博士论文!
  3. 九个案例简述Web设计原则:简洁清晰
  4. virtio数据结构总览 | 图
  5. python圆柱体_python绘制圆柱体的方法
  6. algorithm头文件常用函数
  7. hue集成mysql报错_CDH5.7Hue使用sqoop导出mysql数据报错
  8. 关于bash如何进行并发执行!
  9. 初创公司MindMaze研发情绪反应VR,让VR关怀你的喜怒哀乐
  10. jQuery:1.5.1,复选框应用(全选,全不选,反选,提交选中的值,全选/全不选)...
  11. 用 C 语言编写一个网络蜘蛛来搜索网上出现的电子邮件地址
  12. ubutu虚拟机和主机共享同一网络
  13. 【院校信息】2021北京航空航天大学计算机考研数据汇总
  14. 策略模式、工厂模式、装饰者模式总结解析
  15. Worldclim网站CIMP6未来数据下载(校正处理好的数据)
  16. 手机电商营销模式探讨
  17. 计算机人文素养教案,谈谈信息技术课堂中人文素养培养的感想和体会
  18. SpringMVC配置自定义过滤器
  19. 相亲时, 如何向 TA 解释区块链? | 春哥区块链创业记
  20. fasicon.js (无二维码版,如需要js创建二维码版本可联系我:770959294@qq.com)

热门文章

  1. 知乎回答一键导出为PDF——Python实现
  2. 什么是链接,为什么需要链接?
  3. IE中直接访问html,????? help!在IE中用Applet如何访问所在的HTML吗?
  4. 谈一谈Java中的“静态”
  5. Android两种时间轴实现
  6. 免费、高清、无版权图片都从哪里找?
  7. 开源项目推荐:运动控制速度前瞻算法(Look-Ahead),连续小线段高速插补算法
  8. ubuntu appimage文件打不开的解决方案
  9. L1-051 打折 (5 分) pta天梯赛 详解
  10. 排序算法(希尔排序)