由于本人使用的是mac系统,因此在vue.js 的环境搭建上遇到许许多多的坑。感谢 showonne、yubang 技术指导,最终成功解决。下面是个人的搭建过程,权当是做个笔记吧。

由于mac非常人性化的将bash内置于终端中,因此可以直接在终端中使用bash命令。

第一步: Mac OS系统安装 brew

    打开终端运行以下命令:

    /usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

第二步: 安装 node.js

    为了避免使用brew命令经常出错的情况,所以采用手动安装  

    下载地址:https://nodejs.org/en/download/     (选择mac os)

  第三步: 获取nodejs模块安装目录访问权限  (必须步骤)

    sudo chmod -R 777 /usr/local/lib/node_modules/

第四步: 安装 淘宝镜像 (cnpm)    

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

第五步:安装webpack

   cnpm install webpack -g

  第六步:安装vue脚手架

    npm install vue-cli -g   (npm下载速度超级慢,目前cnpm已经成功替代npm)
   sudo cnpm install -g vue-cli

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

    cd 目录路径
 

  第八步:创建一个vue.js工程

    vue init webpack(使用哪个模板?不懂可以百度一下) 工程名字<工程名字不能用中文>

  第九步:安装项目依赖

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

    npm install    (慎用,会非常慢)
    cnpm install     

  第十步:安装 vue 路由模块vue-router和网络请求模块vue-resource

    cnpm install vue-router vue-resource --save

  启动项目

    npm run dev

  总结:新手上路,一大堆的错误正在慢慢解决,目前成功入坑 vue.js 感兴趣的朋友可以一起学习交流下。
												

关于 vue.js 运行环境的搭建(mac)的更多相关文章

  1. Vue.js 运行环境搭建详解(基于windows的手把手安装教学)及vue、node基础知识普及

    Vue.js 是一套构建用户界面的渐进式框架.他自身不是一个全能框架——只聚焦于视图层.因此它非常容易学习,非常容易与其它库或已有项目整合.在与相关工具和支持库一起使用时,Vue.js 也能完美地驱动 ...

  2. 基于webpack的Vue.js开发环境快速搭建

    1. 安装node node下载地址 2. 安装淘宝 NPM npm 是node.js 的包管理工具. 镜像命令地址 #命令行: npm install -g cnpm 3. 安装vue # 全局安装 ...

  3. Vue.js 开发环境的搭建

    1. cnpm install vue-cli(安装vue 脚手架) 2. vue init webpack my-project(my-project:自定义,取一个项目的名字,init 初始化一个 ...

  4. Mac安装vue.js开发环境

    Mac安装vue.js开发环境 DannyHooDanny的专栏订阅 一.vue.js开发环境 二.初始化一个vue.js项目 三.vue.js项目打包部署 本来以为在Mac上搭建vue.js的环境挺 ...

  5. windows下vue.js开发环境搭建教程

    这篇文章主要为大家详细介绍了windows下vue.js开发环境搭建教程,具有一定的参考价值,感兴趣的小伙伴们可以参考一下 最近,vue.js越来越火.在这样的大浪潮下,我也开始进入vue的学习行列中 ...

  6. vue.js开发环境搭建以及创建一个vue实例

    Vue.js 是一套构建用户界面的渐进式框架.Vue 只关注视图层, 采用自底向上增量开发的设计.Vue 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件. 在使用 vue.js ...

  7. Java开发和运行环境的搭建

    Java开发需要准备的东西? JDK+Eclipse 其中JDK的意思是Java开发工具包,Eclipse是进行用于做Java程序开发的工具(当然你也可以用记事本什么的去做). 其他开发工具:JCre ...

  8. SAAS云平台搭建札记: (二) Linux Ubutu下.Net Core整套运行环境的搭建

    最近做的项目,由于预算有限,公司决定不采购Windows服务器,而采购基于Linux的服务器. 一般的VPS服务器,如果使用Windows系统,那么Windows Server2012\2016安装好 ...

  9. 《算法》第四版 IDEA 运行环境的搭建

    <算法>第四版 IDEA 运行环境的搭建 新建 模板 小书匠 在搭建之初,我是想不到会出现如此之多的问题.我看了网上的大部分教程,都是基于Eclipse搭建的,还没有使用IDEA搭建的教程 ...

随机推荐

  1. CoreAnimation 目录

    CoreAnimation 目录 CoreAnimation 开篇 CoreAnimation 寄宿图 CoreAnimation 图层几何学 CoreAnimation 视觉效果

  2. SQLSERVER 切换数据库为单用户和多用户模式

    有时候数据库在占用时,想做一些操作,无法操作.可以尝试将数据库切换为单用户模式来操作.操作完之后再切换回多用户模式. 命令如下: alter database 数据库名 set Single_user ...

  3. 解决win10 关键错误开始菜单和cortana无法工作 的问题(转-真的成功了)

    问题描述: 一次强制关机后出现了这个对话框,注销.重启均无法解决问题 解决过程[因为我用的英文版操作系统,所以截图都是英文,请大家自行对照自己的操作系统]: 1.ctrl+alt+del 打开任务管理 ...

  4. Android解析xml文件-采用DOM,PULL,SAX三种方法解析

    解析如下xml文件 <?xml version="1.0" encoding="UTF-8"?> <persons> <perso ...

  5. 转载linux c语言程序的Makefile编写

    对于程序设计员来说,makefile是我们绕不过去的一个坎.可能对于习惯Visual C++的用户来说,是否会编写makefile无所谓.毕竟工具本身已经帮我们做好了全部的编译流程.但是在Linux上 ...

  6. Spring execution表达式

    execution(modifiers-pattern? ret-type-pattern declaring-type-pattern? name-pattern(param-pattern) th ...

  7. 老李分享:《Linux Shell脚本攻略》 要点(五)

    老李分享:<Linux Shell脚本攻略> 要点(五)   //1.打包.解包 [root@localhost program_test]# tar -cf output.tar 11. ...

  8. 在centOS7.2安装配置zabbix监控

    zabbix由两部分组成,zabbix-server与可选的zabbix-agent.zabbix-server可以通过SNMP,ZABBIX-AGENT,PING,端口监视等方法提供对远程服务器/网 ...

  9. jmeter 使用jmeter 录制web脚本

    1.打开jmeter.鼠标右击工作台.添加HTTP代理服务器 2.设置端口号.目标控制器.分组 3.添加查看结果树 4.点击启动.确定完成 5.打开浏览器直接进行操作.就可以看到所录制的脚本信息

  10. Python 列表(List) 的三种遍历(序号和值)方法

    三种遍历列表里面序号和值的方法: 最近学习python这门语言,感觉到其对自己的工作效率有很大的提升,特在情人节这一天写下了这篇博客,下面废话不多说,直接贴代码 #!/usr/bin/env pyth ...