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组 ...
随机推荐
- zookeeper配置
原文链接:https://www.cnblogs.com/yuyijq/p/3438829.html 前面两篇文章介绍了Zookeeper是什么和可以干什么,那么接下来我们就实际的接触一下Zookee ...
- idea tomcat上传图片,无法显示的问题解决
真是浪费时间啊,之前eclipse下的tomcat 去webapps下找就行了,这倒好,idea下根本没有. 我上传的目录建在项目中的static中了,upload文件夹,上传到这里肯定是找不到了的: ...
- NPOI学习笔记
NPOI最简单的创建一个Excel,并且在指定单元格内填写一些数据 HSSFWorkbook workbook = new HSSFWorkbook(file); ISheet sheet = wor ...
- 多目标遗传算法 ------ NSGA-II (部分源码解析) 实数、二进制编码的变异操作 mutation.c
遗传算法的变异操作 /* Mutation routines */ # include <stdio.h> # include <stdlib.h> # include < ...
- lombok 工具类的介绍
lombok 是一个非常非常好用的工具类.打个比方,一个bean,需要字段,get set方法 无参有参构造器,重写equals和hashcode,字段一多很麻烦.它,就是来解决这个问题的.一个注解全 ...
- C++面试集锦( 面试被问到的问题 )
1. C 和 C++ 区别 2. const 有什么用途 主要有三点: 1:定义只读变量,即常量 2:修饰函数的参数和函数的返回值 3: 修饰函数的定义体,这里的函数为类的成员函数,被cons ...
- cdqz2017-test10-加帕里图书馆(区间DP & 简单容斥)
给定一个由小写字母组成的字符串,输出有多少重复的回文子序列 #include<cstdio> #include<cstring> using namespace std; #d ...
- Nginx 学习笔记(二)Web 服务启用 HTTP/2
个人网站提升为HTTP2.0协议,加速访问 一.条件 1.openssl的版本必须在1.0.2e及以上 2.nginx的版本必须在1.9.5以上 二.编译安装 1.openssl 编译安装 (1)开始 ...
- Linux 命令详解(九)轻易删除OpenSSL 的后果
警告自己,不要轻易的去删除系统的软件 1.composer自动更新出现错误 www@TinywanAliYun:~/web/go-study-line$ composer self-update Ke ...
- Bulma - 基于 Flexbox 的现代化的 CSS 框架
Bulma 是一个基于 Flexbox 的现代化的 CSS 框架,设计的初衷就是移动优先(Mobile First),模块化设计,可以轻松用来实现各种简单或者复制的内容布局,浏览器支持:浏览器支持:C ...