For me or other first studying vue.js。

For Windows PC:

1.先安装node.js 安装官网最新的即可 版本应该要大于6.0版本

nodejs的官网:https://nodejs.org/en/
 
2.安装git Git的官网:https://git-scm.com/downloads
 
3.安装成功后,查看PC 命令行工具,敲击 node -v 和git --version 指令,能看到相应的版本信息,说明环境变量都已经配置成功。

4.然后使用node.js npm工具download ,但是npm工具在国内网络比较慢,所以建议走cnpm 镜像来download。

装镜像cnpm,在cmd中输入:npm install -g cnpm -registry=https://registry.npm.taobao.org 回车

5.安装成功后,使用cnpm安装vue-cli 脚手架工具,

在cmd中输入:  cnpm install -g vue-cli 回车,等待安装

6.安装成功后,在PC命令行工具,敲击vue指令,能看到相应的信息,说明vue脚手架安装成功。

7.然后进入需要建project的磁盘,开始创建项目:vue init webpack xxxxx   (xxxxx是你创建的项目名)

ps:第四个问题是一个选择,你可以通过上下箭头来选择,一般选择第一个

后面的问题都是根据需要来回答yes or no  vue-router 路由插件        ESLint 代码检查工具        unit test 单元测试        nightwatch 测试框架

做完这一步,已经出现vuedemo2文件夹,这个就是创建的项目。

8.然后进入创建的vuedemo2目录,敲击指令cnpm install 下载一些依赖。

9.然后将项目跑起来。

10.项目跑起来后,会提示如下:

11.然后访问 http://localhost:8080

关于Vue环境安装和测试运行部分已经OK了。

Vue.js 安装及其环境搭建的更多相关文章

  1. Vue.js安装及环境搭建

    Vue.js环境搭建-Windows版 步骤一:安装node.js 在搭建vue的开发环境之前,需要先下载node.js,vue的运行是要依赖于node的npm的管理工具来实现,node可以在官网或者 ...

  2. 【转载】Vue.js 安装及其环境搭建

    注:最近在学习Vue,以下是环境搭配方法: ****************************************************************************** ...

  3. 萌新--关于vue.js入门及环境搭建

    十几天闭关修炼,恶补了html跟css以及JavaScript相应的基础知识,恰巧有个群友准备做开源项目,愿意带着我做,但是要求我必须懂vue.js,所以开始恶补vue.js相关的东西. 在淘宝上买了 ...

  4. Windows 系统下Vue的安装及环境搭建

    Hope to help those in need and those who use Vue for the first time. 1.获得并安装node.js.nodejs官网:https:/ ...

  5. 【vue】vue.js安装教程/vue项目搭建

    前提:已安装nodejs——npm  (备注教程  “物理安装”  ) 第一步:建了一个managerSys文件夹,用于保存项目 第二步:从cmd进入该文件夹,之后开始安装vue.js相关 1)在该项 ...

  6. vue.js安装过程(npm安装)

    一.开发环境 vue推荐开发环境: Node.js: JavaScript运行环境(runtime),不同系统直接运行各种编程语言 npm: Nodejs下的包管理器. webpack: 它主要的用途 ...

  7. node.js之开发环境搭建

    一.安装linux系统 (已安装linux可跳此步骤) 虚拟机推荐选择:VirtualBox 或者 Vmware (专业版永久激活码:5A02H-AU243-TZJ49-GTC7K-3C61N) 我这 ...

  8. 01: vue.js安装

    1.1 vue.js安装与基本使用 官网:https://cn.vuejs.org/ 1.使用之前,我们先来掌握3个东西是用来干什么的 1. npm: Nodejs下的包管理器. 2. webpack ...

  9. 《Node.js入门》CentOS 6.5下Node.js Web开发环境搭建笔记

    近期想尝试一下英特尔的基于WebRTC协同通信开发套件,所以须要在本地搭建Node.js Web的开发測试环境. 这里讲的是CentOS 下的搭建方法.使用Windows的小伙伴请參考: <No ...

随机推荐

  1. 抛弃Https让Cas以Http协议提供单点登录服务

    本文环境: 1.apache-tomcat-7.0.50-windows-x86 2.cas-server-3.4.11 3.cas-client-3.2.1 将cas-server-webapp-3 ...

  2. admins.py总结比较,转

    转:http://blog.csdn.net/pipisorry/article/details/46764495

  3. hadoop文件IO

    InputStreamReader 是字节流通向字符流的桥梁:它使用指定的 charset 读取字节并将其解码为字符.它使用的字符集可以由名称指定或显式给定,或者可以接受平台默认的字符集. Input ...

  4. 解决Iframe session过期,登录界面无法全页刷新

    在登录界面增加如下js代码: <script language=”JavaScript”> if (window != top) top.location.href = location. ...

  5. js客户端UI框架

    Best jQuery UI http://b-jui.com/ jQuery EasyUI http://www.jeasyui.com/ bootstrap学习网: http://www.runo ...

  6. font-face自定义字体使用方法

    今天闲的蛋疼小七来聊一聊关于css3的font-face属性的使用方法: 首先应该好多人没用过这个属性,那只能说你们的设计师还是有人性的, 一旦电脑系统没有的特殊字体或者你设计师故意装13为难你就需要 ...

  7. 获取设备 ID 和名称

    获取设备 ID 和名称 .NET Framework 3.5   其他版本   更新:2007 年 11 月 要获取设备的名称,请使用 Dns.GetHostName 属性.通常情况下,默认名称为“P ...

  8. 图像处理笔记(1): bmp文件结构处理与显示

    1.1图和调色板的概念 如今Windows(3.x以及95,98,NT)系列已经成为绝大多数用户使用的操作系统,它比DOS成功的一个重要因素是它可视化的漂亮界面.那么Windows是如何显示图象的呢? ...

  9. 安装android studio时候弹出unable to access android sdk add-on list解决方法

    本文转载自:http://www.cnblogs.com/rancvl/p/6081791.html Android Studio First Run 检测 Android SDK 及更新,由于众所周 ...

  10. jave获取音频时长

    本文转载自:http://blog.csdn.net/ntotl/article/details/50419983 下载 jave-1.0.2.jar File source =new File('d ...