【vue基础学习】vue.js开发环境搭建
1.安装node.js(http://www.runoob.com/nodejs/nodejs-install-setup.html)
2.基于node.js,利用淘宝npm镜像安装相关依赖
在cmd里直接输入:npm install -g cnpm --registry=https://registry.npm.taobao.org,回车,等待安装...

3.安装全局vue-cli脚手架,用于帮助搭建所需的模板框架
在cmd里
1)输入:
cnpm install -g vue-cli
回车,等待安装...

2).输入:vue,回车,若出现vue信息说明表示成功

4.创建项目
在cmd里输入:
vue init webpack vue_test
(项目文件夹名),回车,等待一小会儿,依次出现‘git’下的项,可按下图操作
5.安装依赖
在cmd里 1).输入:cd vue_test(项目名),回车,进入到具体项目文件夹
2).输入:cnpm install,回车,等待一小会儿
回到项目文件夹,会发现项目结构里,多了一个node_modules文件夹(该文件里的内容就是之前安装的依赖)
基于脚手架创建的默认项目结构如下图所示:
6.测试环境是否搭建成功
方法1:在cmd里输入:
cnpm run dev

方法2:在浏览里输入:http://localhost:8080 (默认端口为8080)
运行起来后的效果如下图所示:

资料参考:https://www.cnblogs.com/ganmy/p/6029774.html
【vue基础学习】vue.js开发环境搭建的更多相关文章
- windows下vue.js开发环境搭建教程
这篇文章主要为大家详细介绍了windows下vue.js开发环境搭建教程,具有一定的参考价值,感兴趣的小伙伴们可以参考一下 最近,vue.js越来越火.在这样的大浪潮下,我也开始进入vue的学习行列中 ...
- Linux虚拟机中 Node.js 开发环境搭建
Node.js 开发环境搭建: 1.下载CentOS镜像文件和VMWare虚拟机程序; 2.安装VMWare——>添加虚拟机——>选择CentOS镜像文件即可默认安装带有桌面的Linux虚 ...
- opengl基础学习专题 (一 )编程环境搭建
题外话: 第一次在博客园上同大家分享博文.水的的地方,错别字的地方.环境交流.批评.知道了马上改. 以前在百度空间中写技术分享博文,后来百度啥也没说就把整个空间封了.当时感觉 还是有点寒心.只想黑一下 ...
- python学习之python开发环境搭建
Python简介 Python是一种面向对象.解释型计算机程序设计语言.Python语法简洁而清晰,具有丰富和强大的类库等等众多的特性,这是来自百度百科的介绍,在百度百科还能看到它的更详细的介绍信息, ...
- Scala学习1————scala开发环境搭建(windows 10)
Scala开发环境搭建 先讲几点我学习scala的目的或者原因吧: JVM在企业中的霸主地位,Scala也是JVM上的语言,很有可能未来会从Java过度到Scala也不是不可能. 先进的函数式编程和面 ...
- Beaglebone Back学习三(开发环境搭建)
开发环境搭建 1 Ubuntu环境搭建 2 Window环境搭建 3 开发板环境搭建 1 Ubuntu环境搭建 (1)安装必要的网络工具 samba nfs tftp vmware-tools sam ...
- vue.js开发环境搭建以及创建一个vue实例
Vue.js 是一套构建用户界面的渐进式框架.Vue 只关注视图层, 采用自底向上增量开发的设计.Vue 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件. 在使用 vue.js ...
- Vue.js开发环境搭建的介绍
包含了最基础的Vue.js的框架,包含了打包工具和测试工具,开发调试的最基本的服务器,不需要关注细节,只需关注Vuejs对项目的实现 npm在国内的网络使用较慢,所以推荐下载安装淘宝的镜像 1: 2: ...
- angular2.0学习笔记1.开发环境搭建 (node.js和npm的安装)
开发环境, 1.安装Node.js®和npm, node 6.9.x 和 npm 3.x.x 以上的版本. 更老的版本可能会出现错误,更新的版本则没问题. 控制台窗口中运行命令 node -v 和 n ...
- 在windows环境下基于sublime text3的node.js开发环境搭建
首先安装sublime text3,百度一堆,自己找吧.理论上sublime text2应该也可以.我只能说一句:这个软件实在是太强悍了. 跨平台,丰富的插件体系,加上插件基本上就是一个强悍的ide了 ...
随机推荐
- Java如何使用重载方法处理异常?
在Java编程中,如何使用重载方法处理异常? 此示例显示如何使用重载方法来处理异常.需要在每个方法中使用try catch块. package com.yiibai; public class Exc ...
- maven中json-lib库无法引入
今天在maven中引入json-lib库,intellij中的pom文件没有报错,但是在类中就是无法使用. pom依赖配置: <dependency> <groupId>net ...
- Unity--------------------万向锁的概念
万向锁 一直困惑我很久....原因出在这里,我以为欧拉角旋转是以模型坐标(齐次坐标系)为旋转轴.问题就来了,无论旋转那个轴,其它两个轴也会相应的变化,下面看图: 根据上面的说明两个旋转面(圆圈)怎么会 ...
- CI框架 -- 核心文件 之 Input.php(输入数据处理文件)
class CI_Input { //用户ip地址 protected $ip_address = FALSE; //用户浏览器地址 protected $user_agent = FALSE; // ...
- 如何使用Matrix对bitmap的旋转与镜像水平垂直翻转
Bitmap convert(Bitmap a, int width, int height){int w = a.getWidth();int h = a.getHeight();Bitmap ne ...
- workerman定时器使用
From: http://doc3.workerman.net/worker-development/add.html add int \Workerman\Lib\Timer::add(float ...
- 关于js中namespace命名空间模式
命名空间有助于减少程序中所需要的全局变量的数量,并且同时有助于避免命名冲突或过长的名字前缀. 关于命名空间的例子: /** * 创建全局对象MYAPP * @module MYAPP * @title ...
- cocos2d - CCSprite各种动画
转自 ITeye技术网站 // 触摸屏 -(void) ccTouchesEnded:(NSSet *)touches withEvent:(UIEvent *)event { for( UITouc ...
- 关于jq ajax封装以及ajax上传Webapi
jq的ajax完整版本 $(function () { fileChange(); }); function fileChange() { $('#fileinput').change ...
- 关于SpringMVC Json使用
很简单的一个东西,这里就不做过多介绍了,写一个小Demo,随手记录下. 首先,在搭好SpringMVC工程环境之后,如果想用Spring自带的Json,需要额外的添加2个JAR包: 1.jackson ...