Vue 开发环境搭建 (Mac)
一、初识
由于个人工作原因以及技术需要一个提升,略晚的开始初探Vue ~。~
二、那么Vue是什么呢?
他就是一个前端的框架,特点是数据双向绑定、组件化。
三、推荐开发环境

四、环境安装
打开终端运行以下命令
1.安装brew
/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
2.安装 nodejs
brew install nodejs
3.获取nodejs模块安装目录访问权限
sudo chmod -R /usr/local/lib/node_modules/
4.安装淘宝镜像(cnmp)
npm install -g cnpm --registry=https://registry.npm.taobao.org
5.安装webpack
cnpm install webpack -g
6.安装vue脚手架
npm install vue-cli -g
7.在硬盘上找一个文件夹放工程用的,在终端中进入该目录
cd 目录路径
8.根据模板创建项目
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 写你自己的名字
9.cd 命令进入创建的工程目录
cd 工程名称
注意:最后三步都是要进入到当前工程目录后执行的。
10.安装项目依赖
npm install
11.安装 vue 路由模块vue-router和网络请求模块vue-resource
cnpm install vue-router vue-resource --save
12.启动项目
npm run dev
Vue官网:https://cn.vuejs.org/v2/guide/instance.html
内容部分出处:http://www.open-open.com/lib/view/open1476240930270.html#articleHeader9
Vue 开发环境搭建 (Mac)的更多相关文章
- vue开发环境搭建Mac版
一.前言 要做一个移动端app,面对webapp最流行的三个技术React,angular,vue,三选一,如何选,可参考blog移动app技术选型,react,angular, vue, 下面是对 ...
- (一)Hololens Unity 开发环境搭建(Mac BOOTCAMP WIN10)
(一)Hololens Unity 开发环境搭建(Mac BOOTCAMP WIN10) 系统要求 64位 Windows 10 除了家庭版的 都支持 ~ 64位CPU CPU至少是四核心以上~ 至少 ...
- vue开发环境搭建及热更新
写这篇博客的目的是让广大的学者在初入Vue项目的时候少走些弯路,虽然现在有很多博客也有差不多的内容,但是博主在里面添加了一些学习时碰到的小问题.在阅读这篇博客之前,我先给大家推荐一篇文章<入门W ...
- express+mysql+vue开发环境搭建
最近开始做一个实验室资产管理系统,后台使用node.js的Express框架,前端使用vue,数据库使用mysql.在这里开始简单记录一下开发过程和遇到的问题. 今天要说的是express+mysql ...
- 【强烈推荐,超详细,实操零失误】node.js安装 + npm安装教程 + Vue开发环境搭建
node.js安装 + npm安装教程 + Vue开发环境搭建 [强烈推荐,超详细,实操零失误] 原博客园地址:https://www.cnblogs.com/goldlong/p/8027997.h ...
- vue 开发系列(一) vue 开发环境搭建
概要 目前前端开发技术越来越像后台开发了,有一站式的解决方案. 1.JS包的依赖管理像MAVEN. 2.JS代码编译打包. 3.组件式的开发. vue 是一个前端的一站式的前端解决方案,从项目的初始化 ...
- 最全Vue开发环境搭建
前言 一直想去学Vue,不过一直找不到一个契机.然公司手机端用到了跨平台开发apicloud,里边涉及到Vue组件化开发,例如header和footer的封装,以及apicloud自定义的frame等 ...
- 一 vue开发环境搭建
2016年,Vue同Angular.React形成三足鼎立的局面,让前端的开发者顾不暇接,今天我们就来了解一下Vue的环境搭建. 一.node.js安装: node.js:一种javascript的运 ...
- 【VUE】Mac下vue 开发环境搭建,以及目录结构
1 安装Node.js 参看 node.js环境安装 http://www.cnblogs.com/richerdyoung/p/7265786.html 2 安装淘宝镜像 npm install ...
随机推荐
- MVC与单元测试实践之健身网站(完)-备案与部署
主页-http://www.zhixin9001.cn/Home/Introduce GitHub- https://github.com/zhixin9001/Fitness 这是关于Fit网站的最 ...
- angular升级指南
废话少说 上链接 angular 升级指南
- Python机器学习入门
# NumPy Python科学计算基础包 import numpy as np # 导入numpy库并起别名为npnumpy_array = np.array([[1,3,5],[2,4,6]])p ...
- Lucene创建索引流程
1.创建索引流程 原始文档:互联网上的网页(爬虫或蜘蛛).数据库中的数据.磁盘上的文件 创建文档对象(非结构化数据) 文档对象中的属性不叫属性现在成为域. 每个 Document 可以有多个 Fiel ...
- 11-OpenLDAP主从同步
OpenLDAP主从同步 阅读视图 部署环境 OpenLDAP服务器初始化 配置主服务器同步策略 配置从服务器 OpenLDAP主从同步验证 故障诊断 1. 部署环境 本文以两台服务器为蓝本演示其同步 ...
- 洗礼灵魂,修炼python(47)--巩固篇—定义类的方法之@classmethod,@staticmethod
定义类的方法,相信你会说,不就是在class语句下使用def () 就是定义类的方法了嘛,是的,这是定义的方法的一种,而且是最普通的方式 首先,我们已经知道有两种方式: 1.普通方法: 1)与类无关的 ...
- VS发布web应用程序报:无法识别的特性“xmlns:xdt”。请注意特性名称区分大小写 或 未能将文件obj\...复制到obj\...未能找到路径
问题1:无法识别的特性“xmlns:xdt”.请注意特性名称区分大小写 问题2:未能将文件obj\...复制到obj\...未能找到路径 解决办法:将web项目文件下的obj文件夹从项目中排除,然后再 ...
- PLS-00306: 调用 'SYNCRN' 时参数个数或类型错误
System.Data.OracleClient.OracleException (0x80131938): ORA-00604: 递归 SQL 级别 1 出现错误 ORA-06550: 第 1 行, ...
- MySQL 1130 - Host 127.0.0.1 is not allowed to connect to this MySQL server
在开发中为了让开发更方便,在本地配置环境,希望可以直接访问服务器上的MySQL数据库,更方便的管理数据库, 需要在本地远程连接linux服务器的本地数据库,直接用数据库管理工具连接出现如下报错1130 ...
- sql语句如何将多个空格字符替换成一个空格字符
很多时候,数据表中某个字段的值会带有一个或多个空格字符串的情况,面对多样化的需求,我们可能需要将这些空格字符串去除,当然,这很好说,我们可以直接用replace(' ','')将单个空格变成无就可以了 ...