vuejs初学入门环境搭建
一、Nodejs:
1、安装下载:http://nodejs.cn/download/
2、Node.js安装配置: http://www.runoob.com/nodejs/nodejs-install-setup.html(3、4点都有说明)
3、版本查询:cmd命令提示符: node --version
4、检测PATH环境变量是否配置了Nodejs: cmd命令提示符为: path
二、vuejs开发
1.安装node.js(http://nodejs.cn/download/)
2.基于node.js,利用淘宝npm镜像安装相关依赖
在cmd里直接输入:npm install -g cnpm –registry=https://registry.npm.taobao.org回车,等待安装...
注意: 如果提示错误npm WARN deprecated socks@1.1.10 就要降低
降低npm版本 npm install npm@4.6.1 -g
3.安装全局vue-cli脚手架,用于帮助搭建所需的模板框架
在cmd里 1)输入:cnpm install -g vue-cli,回车,等待安装...
2).输入:vue,回车,若出现vue信息说明表示成功
4.创建项目
在cmd里输入:vue init webpack vuedemo(项目文件夹名),回车后等待,出现‘git’下的项,可按下图操作
5.安装依赖
在cmd里 1).输入:cd vuedemo(项目名),回车,进入到具体项目文件夹
2).输入:cnpm install,回车,等待一小会儿
回到项目文件夹,会发现项目结构里,多了一个node_modules文件夹(该文件里的内容就是之前安装的依赖)
基于脚手架创建的默认项目结构如下图所示:
6.测试环境是否搭建成功
方法1:在cmd里输入:cnpm run dev
方法2:在浏览里输入:localhost:8080(默认端口为8080)
运行起来后的效果如下图所示:
参照原文:http://blog.csdn.net/luckylqh/article/details/52863026 和https://www.cnblogs.com/learnings/p/6261108.html
注:Vue-cli搭建项目后的目录结构不理解的可以从这里了解:http://www.jb51.net/article/118561.htm
vuejs初学入门环境搭建的更多相关文章
- Windows C#入门环境搭建
Windows C#入门环境搭建 1. 安装Microsoft .NET Framework目录: C:\Windows\Microsoft.NET\Framework,查看已经安装的版本. 如果未安 ...
- ArcGIS API for Silverlight/ 开发入门 环境搭建
Silverlight/ 开发入门 环境搭建1 Silverlight SDK下载ArcGIS API for Microsoft Silverlight/WPF ,需要注册一个ESRI Gloab ...
- Android开发使用控件入门--环境搭建
Android开发使用控件入门--环境搭建 软件名称(,梦,,想.CAD ,控件) 1. 环境搭建: 3 1.1. 安装Eclipse 3 1.2. 下载JDK 3 1.3. 下载Android S ...
- 57.NodeJS入门--环境搭建 IntelliJ IDEA
转自:https://blog.csdn.net/wang19891106/article/details/51127133 NodeJS入门–环境搭建 IntelliJ IDEA 本人也刚开始学习N ...
- NodeJS入门--环境搭建 IntelliJ IDEA
NodeJS入门–环境搭建 IntelliJ IDEA 本人也刚开始学习NodeJS,所以以此做个笔记,欢迎大家提出意见. 1.首先 下载安装NodeJS,下载安装IntelliJ IDEA 2.接下 ...
- Couchbase入门——环境搭建以及HelloWorld
一.引言 NoSQL(Not Only SQL),火了很久了,一直没空研究.最近手上一个项目对Cache有一定的要求,借此机会对NoSQL入门一下.支持NoSQL的数据库系统有很多, 比如Redis ...
- Jenkins入门-环境搭建(1)
因为Jenkins的环境搭建比较简单,本来不想来介绍,但是发现有些入门小朋友,从各种网站上下载的各种安装包来搭建,最后导致出现了各种千奇百怪的问题,介于这种情况下我决定还是来写一下Jenkins的环境 ...
- Activiti入门 -- 环境搭建和核心API简介
相关文章: <史上最权威的Activiti框架学习指南> <Activiti入门 -- 轻松解读数据库> 本章内容,主要讲解Activiti框架环境的搭建,能够使用Activi ...
- 第三方web ide开发环境下vuejs开发HMR环境搭建-码农这样开发是快乐的!
vuejs是一个非常优秀的前端框架,利用该框架可以快速开发出任何web app,之所以vuejs开发非常高效快捷,其中最重要的一点就是利用webpakc提供的HMR(热模块替换)特性,可以边写vue组 ...
随机推荐
- luogu2542 航线规划 (树链剖分)
不会lct,所以只能树剖乱搞 一般这种删边的题都是离线倒着做,变成加边 他要求的结果其实就是缩点以后两点间的距离. 然后先根据最后剩下的边随便做出一个生成树,然后假装把剩下的边当成加边操作以后处理 这 ...
- SSM框架中的前后端分离
认识前后端分离 在传统的web应用开发中,大多数的程序员会将浏览器作为前后端的分界线.将浏览器中为用户进行页面展示的部分称之为前端,而将运行在服务器,为前端提供业务逻辑和数据准备的所有代码统称为后端. ...
- Elasticsearch利用cat api快速查看集群状态、内存、磁盘使用情况
使用场景 当Elasticsearch集群中有节点挂掉,我们可以去查看集群的日志信息查找错误,不过在查找错误日志之前,我们可以通过elasticsearch的cat api简单判断下各个节点的状态,包 ...
- 关于:HTTP Header -> Content-Type: text/plain Cache-Control: no-cache IE浏览器弹出错误下载对话
下午遇到一个很奇怪的现象,一个网址: http://192.168.1.3/login?action=a&fr=b.com 注意网址后面的参数形式,action参数在前,最后一个参数值的尾部含 ...
- poj 1236(强连通分量分解模板题)
传送门 题意: N(2<N<100)个学校之间有单向的网络,每个学校得到一套软件后,可以通过单向网络向周边的学校传输. 问题1:初始至少需要向多少个学校发放软件,使得网络内所有的学校最终都 ...
- HTML中使用<input>添加的按钮打开一个链接
在HTML中,<form>表单的<input type="button">可以添加一个按钮.如果想让该按钮实现<a> 的超链接功能,需要如下实现 ...
- bind&currying
1. bind 基本用法 bind()是ECMAScript5中新增的方法,这个方法主要作用是将函数绑定至某个对象.当在函数f()上调用bind()方法并传入一个对象o作为参数,这个方法将返回一个新函 ...
- go语言从零学起(四) -- 基于martini和gorilla实现的websocket聊天实例
如果只是想了解chat的实现方式,在gorilla和revel框架里面都有完整的chat实例可以提供参考.本篇讲解的是,如何基于martini实现websocket的聊天. 配置步骤: 1 已经安装了 ...
- H3C配置FTP服务器
H3C配置FTP服务器 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.FTP协议简介 1.FTP协议是互联网上广泛使用的文件传输协议 FTP文件传送协议(File Transf ...
- shell提取文件后缀名,并判断其是否为特定字符串
如果文件是 .css文件 或 .js文件,则进行处理. file=$1 if [ "${file##*.}"x = "css"x ]||[ "${fi ...