vue-cli全局安装
一、安装node.js
a)、不确定自己时候安装了node.js可以在控制台当中输入node -v来查看当前是否已经存在
如果看到输出了版本信息,那么证明已经有了node.js
b)、如果看到node不是内部命令,那么还没有安装node,node下载网址:http://nodejs.cn/download/
注 :安装 vue-cli 脚手架目前需要node版本为 v4.0 以上;
二、Vue-cli全局安装
a)、因为在国内npm安装会比较慢,所以这里推荐一下先安装淘宝镜像(官网:http://npm.taobao.org;)
b)、在控制台执行命令:npm install cnpm -g --registry=https://registry.npm.taobao.org
c)、安装完成就可以使用cnpm来代替之前的npm这样的安装效率会快很多(以下操作会由cnpm代替npm)
d)、操作完以上步骤可以在继续在命令行输入:cnpm install -g vue-cli。安装成功之后输入vue按下回车出现如下图表示安装正确:
三、初始化项目
a)、继续在命令行输入:vue init webpack myproject(*myproject为自己的项目名称)
执行了此命令会自动构建一个myproject文件夹,整个初始化流程如下图:
项目初始化完成之后按照命令行提示:
cd myproject
cnpm run dev
以上两个命令执行完成会在命令行出现一个地址:
copy地址在浏览器中打开如图:
在浏览器看到这个界面的时候证明咱们的项目已经安装,并且启动成功,接下来可以进行代码的书写操作了
结语:vue的目录结构,以及每个目录的用法我会在下一篇文章中进行详细说明,希望大家多多支持,你们的支持是我前进的动力
vue-cli全局安装的更多相关文章
- vue cli的安装与使用
一.简介 vue作为前端开发的热门工具,受到前端开发人员的喜爱.为了简化项目的构建,采用vue cli来简化开发. vue cli是一个全局安装的npm包,提供了终端使用的命令.vue create可 ...
- Vue CLI 介绍安装
https://cli.vuejs.org/zh/guide/ 介绍 警告 这份文档是对应 @vue/cli 3.x 版本的.老版本的 vue-cli 文档请移步这里. Vue CLI 是一个基于 V ...
- [转]Vue CLI 3搭建vue+vuex 最全分析
原文地址:https://my.oschina.net/wangnian/blog/2051369 一.介绍 Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统.有三个组件: CLI:@ ...
- 使用vue/cli 创建一个简单的项目
首先,电脑安装了node.js官方要求8.9 或更高版本 (推荐 8.11.0+) npm install -g @vue/cli # OR yarn global add @vue/cli 全局安装 ...
- Vue CLI 3搭建vue+vuex 最全分析
一.介绍 Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统.有三个组件: CLI:@vue/cli 全局安装的 npm 包,提供了终端里的vue命令(如:vue create .vue ...
- Vue Cli安装以及使用
因为公司项目要用vue框架,所以会用vue-cli来新建项目.用过vue的都知道,要全局安装vue以及脚手架vue-cli,然后执行vue init webpack projectname来新建v ...
- 【Vue CLI】从安装到构建项目再到目录结构的说明
目录 1. 构建我们的项目 2. 目录结构说明 2.1 build目录 2.2 config目录 2.3 src目录 2.4 static目录 "Vue CLI是一个基于Vue.js进行快速 ...
- 13. Vue CLI脚手架
一. Vue CLI 介绍 1. 什么是Vue CLI? Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统.Vue CLI 致力于将 Vue 生态中的工具基础标准化.它确保了各种构建工 ...
- vue cli创建typescript项目
使用最新的Vue CLI @vue/cli创建typescript项目,使用vue -V查看当前的vue cli版本 安装命令 npm install -g @vue-cli 创建项目 vue cre ...
- 基于vue cli 3.0创建前端项目并安装cube-ui
前提条件: 安装node.js. 国内的开发者最好先配置淘宝镜像. 之后用cnpm来代替npm命令. 项目创建过程: 打开cmd,输入命令进入目标工作空间,以本机项目为例: cd /d d: cd D ...
随机推荐
- spring-boot-starter-actuator /info获取空信息
用了spring-boot-starter-actuator,在监控页面对应服务中显示空值,下面是正常情况下有的值 pom配置了 <build> <plugins> <p ...
- 一套代码小程序&Web&Native运行的探索07——mpvue简单调研
前言 接上文:[一套代码小程序&Native&Web阶段总结篇]可以这样阅读Vue源码 最近工作比较忙,加之上个月生了小孩,小情人是各种折腾他爸妈,我们可以使用的独立时间片不多,虽然这 ...
- Reactor 典型的 NIO 编程模型
Doug Lea 在 Scalable IO in Java 的 PPT 中描述了 Reactor 编程模型的思想,大部分 NIO 框架和一些中间件的 NIO 编程都与它一样或是它的变体.本文结合 P ...
- MySQL字段操作与数据处理
一,对字段的操作 1.拼接字段:Concat()函数 多数DBMS使用 + 或者 || 来实现拼接,而MySQL使用 Concat() 函数来实现拼接. 实例: Concat()函数拼接时加上的字符需 ...
- CSS 三条横线等分
.header_qian { width: 1.5rem; height: 1.5rem; background: rgba(250, 250, 250,0.7); border-radius: 50 ...
- 介绍Dynamics 365的OrgDBOrgSettings工具
摘要: 微软动态CRM专家罗勇 ,回复320或者20190320可方便获取本文,同时可以在第一间得到我发布的最新博文信息,follow me!我的网站是 www.luoyong.me . 有时候会需要 ...
- 【Android】用Cubism 2制作自己的Live2D——android sdk样本的下载与Android studio编译!
前言- 在浏览Live2d说明书的时候我无意中发现了一个有趣的东西,就是android sdk中居然自带动态壁纸!那就让我们来试试吧,说明书此页的网址连接——中文版||日文版 Android开发所必需 ...
- Android为TV端助力 listview与recyclerview上下联动
首先是主布局fragment里面的xml文件 <?xml version="1.0" encoding="utf-8"?><RelativeL ...
- 未能加载文件或程序集“System.Web.Mvc, Version=5.2.4.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35”或它的某一个依赖项
楼主创建项目的时候选择的是5.2.4的版本,但是后来改成了5.0.0于是出现了这个错误,解决的方法倒也简单 将View文件夹下 web.config文件中 以下两处 版本改成当前版本就行了
- bash: lspci: command not found解决方法
在CentOS虚拟机使得lspci查看硬件信息.使用时,提示bash: lspci: command not found,大多使用/sbin/lspci即可,我发现我的系统中/sbin下也没有.使用y ...