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 ...
随机推荐
- Angular CLI 安装和使用
1.背景介绍 关于Angular版本,Angular官方已经统一命名Angular 1.x同一为Angular JS:Angular 2.x及以上统称Angular: CLI是Command Line ...
- [转]Python in Visual Studio Code
本文转自:https://code.visualstudio.com/docs/languages/python Working with Python in Visual Studio Code, ...
- C#列表页面
前台页面: <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Index.aspx ...
- 从零开始学安全(四十五)●browser_autopwn2漏洞利用配合Ettercap工具实施DNS欺骗攻击
系统:kali 2019 工具Ettercap,Metasploit 环境内网地址 首先 cd /etc/ettercap/ 移动在ettercap 文件下 在用vim 打开编辑 etter.dns ...
- SpringMVC+Mybatis 如何配置多个数据源并切换?
最近公司一个项目需要连接两个数据库(A和B)操作,有的模块查询A库,有的模块查询B库,因此需要改造下,项目后台用的是SpringMVC+Mybatis+MySQL架构,折腾了两天后终于搞定了,在这里记 ...
- SpringCloud-Eureka注册与发现
这两年可以说微服务是热词,也是新领域,学习的成本也较高,基础东西太多比如什么Dubbo,zookeeper,Springboot等等.Dubbo也是实现服务治理又是阿里出的一套开源RPC框架,但是Sp ...
- hash一致性
参照:https://www.cnblogs.com/moonandstar08/p/5405991.html 参照:http://www.cnblogs.com/haippy/archive/201 ...
- Android Intent通讯实例
//1.拨打电话 // 给移动客服10086拨打电话 Uri uri = Uri.parse("tel:10086"); Intent intent = new Intent(In ...
- MyDAL - .UpdateAsync() 之 .SetSegment 根据条件 动态设置 要更新的字段 使用
索引: 目录索引 一.API 列表 1.SetSegment 属性,指示 根据条件 动态拼接 要修改的字段 见如下示例. 二.API 单表-完整 方法 举例 // update 要赋值的变量 var ...
- java class反编译工具----JD-GUI
下载地址 http://jd.benow.ca/