vue环境搭建以及使用vue-cli创建项目
我要跑vue项目,所以我要搞vue。
1、环境搭建
进入node官网下载对应版本的node,一步步安装即可。

安装会自动配置路径和npm包管理环境,通过node -v进行验证

2、安装vue-cli脚手架
Vue CLI文档:https://cli.vuejs.org/zh/guide/
# 卸载旧版本
npm uninstall vue-cli -g
# 指定地址安装,加快速度
npm install -g @vue/cli --registry=https://registry.npm.taobao.org

安装完成后,进行验证
vue
vue --version

完成上面的步骤后,我们就可以使用vue-cli新建项目。
3、使用vue-cli新建项目
3.1 图形化界面创建项目
使用vue ui命令,会打开一个网页
C:\Users\lxp>vue ui
Starting GUI...
Ready on http://localhost:8000

按提示走应该就可以了,下面试试命令行创建。
3.2 命令行创建项目
运行以下命令来创建一个新项目:
vue create 项目名
首先进入某个特定文件夹,输入创建命令,注意项目名不能包含大写字母

命令输入正确的情况下, 会让你选择创建vue-2还是vue-3的项目,根据需要选择,然后等待项目创建成功

生成的项目结构如下

根据它的提示启动项目
cd vue-test
# 等同于npm run dev
npm run serve

访问即可

vue环境搭建以及使用vue-cli创建项目的更多相关文章
- Angular入门,开发环境搭建,使用Angular CLI创建你的第一个Angular项目
前言: 最近一直在使用阿里的NG-ZORRO(Angular组件库)开发公司后端的管理系统,写了一段时间的Angular以后发现对于我们.NET后端开发而言真是非常的友善.因此这篇文章主要是对这段时间 ...
- 前端(二十三)—— Vue环境搭建
目录 一.Vue环境搭建 一.Vue环境搭建 1.安装node 去官网下载node安装包 傻瓜式安装 万一安装后终端没有node环境,要进行node环境变量的配置(C:\Program Files\n ...
- Vue环境搭建、创建与启动、案例
vue环境搭建 """ 1) 安装node 官网下载安装包,傻瓜式安装:https://nodejs.org/zh-cn/ 2) 安装cnpm npm install - ...
- vue环境搭建与创建第一个vuejs文件
我们在前端学习中,学会了HTML.CSS.JS之后一般会选择学习一些框架,比如Jquery.AngularJs等.这个系列的博文是针对于学习Vue.js的同学展开的. 1.如何简单地使用Vue.js ...
- Vue环境搭建及第一个helloWorld
Vue环境搭建及第一个helloWorld 一.环境搭建 1.node.js环境安装配置 https://www.cnblogs.com/liuqiyun/p/8133904.html 或者 htt ...
- jeecms v9 vue环境搭建
一.安装NODEJS运行环境 前往nodejs官网下载nodejs,https://nodejs.org/en/ ,建议下载最新稳定版的,下载后安装即可,下载选择类似如下 安装完毕之后,在cmd中输入 ...
- 55.Vue环境搭建
Vue环境搭建 在搭建过程中出现的错误解决办法 https://www.cnblogs.com/lovebing/p/9488198.html cross-env使用笔记 cross- ...
- NET Core 环境搭建和命令行CLI入门
NET Core 环境搭建和命令行CLI入门 2016年6月27日.NET Core & ASP.NET Core 1.0在Redhat峰会上正式发布,社区里涌现了很多文章,我也计划写个系列文 ...
- NET Core 环境搭建和命令行CLI入门[转]
NET Core 环境搭建和命令行CLI入门 时间:2016-07-06 01:48:19 阅读:258 评论:0 收藏:0 [点我收藏+] 标签: N ...
- Vue环境搭建和项目创建
目录 vue项目 环境搭建 项目创建 vue项目 环境搭建 node node ~~ python:node是用c++编写用来运行js代码的 npm(cnpm) ~~ pip:npm是一个终端应用商城 ...
随机推荐
- UI设计师、平面设计师常用的网站大全,初学者必备,大家都在用!
UI设计师.平面设计师常用的网站大全,初学者必备,大家都在用! 国外的花瓣--Pinterest • The world's catalog of ideas 颜格视觉--app界面设计大全--电商. ...
- 浅谈CRM系统的选型和实施
CRM的本质是最大化利用企业的现有资源来提供客户所需的产品,保证提供给客户最好的服务,帮助销售人员提高客户转化率,储存所有重要的客户信息,帮助企业深入挖掘潜在客户等等. 对于企业来说,即使处于同一行业 ...
- str.isdigit()可以判断变量是否为数字
字符串.isdigit()可以判断变量是否为数字 是则输出True 不是则输出False 好像只能字符串
- SSM框架整合(Spring+SpringMVC+Mybatis)
第一步:创建maven项目并完善项目结构 第二步:相关配置 pom.xml 引入相关jar包 1 <properties> 2 <project.build.sourceEncod ...
- [转发]PotPlayer 无损截取视频片段
PotPlayer 无损截取视频片段 2019-03-29 21:04:21 ForeverStrong 阅读数 2928 收藏 更多 分类专栏: 视频图像编辑 PotPlayer 无损截取视频 ...
- Linux(CentOS 7) 安全加固之非业务端口服务关闭 postfix port 25
目录 关闭TCP 25 端口对应的服务 1. 确认对应端口的进程 2. 查找与关闭对应服务 3. 确认结果,端口已关闭 关闭TCP 25 端口对应的服务 [0 root@Qvps /root] #ca ...
- 基于 IntersectionObserver 实现一个组件的曝光监控
我们在产品推广过程中,经常需要判断用户是否对某个模块感兴趣.那么就需要获取该模块的曝光量和用户对该模块的点击量,若点击量/曝光量越高,说明该模块越有吸引力. 那么如何知道模块对用户是否曝光了呢?之前我 ...
- 如何设计 API 接口,实现统一格式返回?
文章目录: 目录 前后端接口交互 接口返回值约定 返回值规范 正确返回 错误返回 统一定义错误码 错误码规范 Controller 层如何用? 正确返回 错误返回 详细代码实现 错误码 Control ...
- python mixin到底是什么
python mixin到底是什么 1.什么是Mixin 在面向对象编程中,Mixin是一种类,这种类包含了其他类要使用的方法,但不必充当其他类的父类.其他类是如何获取Mixin中的方法因语言的不同而 ...
- GO学习-(32) Go实现日志收集系统1
Go实现日志收集系统1 项目背景 每个系统都有日志,当系统出现问题时,需要通过日志解决问题 当系统机器比较少时,登陆到服务器上查看即可满足 当系统机器规模巨大,登陆到机器上查看几乎不现实 当然即使是机 ...