安装 nodejs

  地址 :https://nodejs.org/en/

npm安装最新版本

  更新npm :npm update -g

安装淘宝镜像

  npm install -g cnpm --registry= https://registry.npm.taobao.org

安装webpack

  npm install webpack -g

安装vue脚手架

  npm install vue-cli -g

在硬盘上找一个文件夹放工程用的,在终端中进入该目录

  cd 目录路径

根据模板创建项目

  vue init webpack-simple 工程名字<工程名字不能用中文>

  或者创建 vue1.0 的项目

  vue init webpack-simple#1.0 工程名字<工程名字不能用中文>

  会有一些初始化的设置,如下输入:

  Target directory exists. Continue? (Y/n) 直接回车默认(然后会下载 vue2.0模板,这里可能需要连代理)

  Project name (vue-test) 直接回车默认

  Project description (A Vue.js project) 直接回车默认

  Author 写你自己的名字

cd 命令进入创建的工程目录

  工程目录如图所示:

  

安装项目依赖

  一定要从官方仓库安装,npm 服务器在国外所以这一步安装速度会很慢。

  npm install

安装 vue 路由模块 vue-router 和网络请求模块 vue-resource

  cnpm install vue-router vue-resource --save

启动项目

  npm run dev

vue.js环境搭建的更多相关文章

  1. Vue + Spring Boot从零开始搭建个人网站(一) 之 项目前端Vue.js环境搭建

    前言: 最近在考虑搭建个人网站,想了想决定采用前后端分离模式 前端使用Vue,负责接收数据 后端使用Spring Boot,负责提供前端需要的API 就这样开启了我边学习边实践之旅 Vue环境搭建步骤 ...

  2. 【前端】vue.js环境配置以及实例运行简明教程

    vue.js环境配置以及实例运行简明教程 声明:本文档编写参考如下两篇博客,是对它们的修改与补充,欢迎点击链接查看原文: 原文1:vue.js在windows本地下搭建环境和创建项目 原文2:Vue. ...

  3. 搭建Vue.js环境,建立一个简单的Vue项目

    基于vue-cli快速构建 Vue是近年来比较火的一个前端框架,所以搭建Vue.js环境,要装webpack,vue-cli,Vue 安装webpack命令如下 $ cnpm install webp ...

  4. 【强烈推荐,超详细,实操零失误】node.js安装 + npm安装教程 + Vue开发环境搭建

    node.js安装 + npm安装教程 + Vue开发环境搭建 [强烈推荐,超详细,实操零失误] 原博客园地址:https://www.cnblogs.com/goldlong/p/8027997.h ...

  5. vue开发环境搭建及热更新

    写这篇博客的目的是让广大的学者在初入Vue项目的时候少走些弯路,虽然现在有很多博客也有差不多的内容,但是博主在里面添加了一些学习时碰到的小问题.在阅读这篇博客之前,我先给大家推荐一篇文章<入门W ...

  6. express+mysql+vue开发环境搭建

    最近开始做一个实验室资产管理系统,后台使用node.js的Express框架,前端使用vue,数据库使用mysql.在这里开始简单记录一下开发过程和遇到的问题. 今天要说的是express+mysql ...

  7. vue项目ide(vue项目环境搭建)

    一.先介绍一下我接下来要做的项目 项目:ide可视化工具 技术应用: Vue2.0(js框架):https://cn.vuejs.org/ ElementUi(饿了吗ui框架基于vue的):http: ...

  8. vue开发环境搭建Mac版

    一.前言 要做一个移动端app,面对webapp最流行的三个技术React,angular,vue,三选一,如何选,可参考blog移动app技术选型,react,angular, vue, 下面是对  ...

  9. 一 vue开发环境搭建

    2016年,Vue同Angular.React形成三足鼎立的局面,让前端的开发者顾不暇接,今天我们就来了解一下Vue的环境搭建. 一.node.js安装: node.js:一种javascript的运 ...

随机推荐

  1. ZOJ 3946 Highway Project

    1.迪杰斯特拉最小堆 #include<cstdio> #include<cstring> #include<cmath> #include<map> ...

  2. Nginx日志配置及日志切割

    日志配置 日志对于统计排错来说非常有利的.本文总结了nginx日志相关的配置如access_log.log_format.open_log_file_cache.log_not_found.log_s ...

  3. FZU 2092 收集水晶

    暴力DP. dp[x1][y1][x2][y2][t]表示,第一个人在(X1,Y1),第二个人在(X2,Y2),时间为t的时候获得的最大价值. 时间复杂度o(t*n*m*n*m*5*5). 什么都不优 ...

  4. 图片拉伸iOS

    - (UIImage *)stretchableImageWithLeftCapWidth:(NSInteger)leftCapWidth topCapHeight: (NSInteger)topCa ...

  5. CSS 弹性盒子布局

    学习地址:https://developer.mozilla.org/zh-CN/docs/Web/CSS/CSS_Flexible_Box_Layout

  6. Yii实现Password Repeat Validate Rule

    在使用Yii时遇到这样的需求:在一个注册的页面输入两次密码,并验证两次输入是否一致.可是password的repeat的字段在数据库 并不存在.问题来了,如何创建一个password_repeat的属 ...

  7. easyui 翻译

    1,DataGrid checkOnSelect: 设置成true:用户点击一行的时候,复选框被选中或者是取消选中 设置成false:只有当用户点击复选框的时候,复选框才能被选中或者是取消选中 sel ...

  8. nginx代理tomcat后,tomcat获取真实(非proxy,非别名)nginx服务端ip端口的解决方案

    nginx代理tomcat后,tomcat获取服务端ip端口的解决方案 1.注意修改nginx配置代理,标红地方 #user nginx; worker_processes ; error_log l ...

  9. java 服务

    2014年2月27日 10:30:55 学习 Java Service Wrapper 2014年2月27日 14:14:14太复杂了,以后研究吧. ###### 2014年2月27日 14:14:2 ...

  10. ASCII 码对应表

    Macron symbol ASCII CODE 238 : HTML entity : [ Home ][ español ] What is my IP address ? your public ...