由于本人使用的是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. C++基础——C面向过程与C++面向对象编程01_圆面积求解

    #include "iostream";//包含C++的头文件using namespace std;//使用命名空间std标准的命名空间(在这个命名空间中定义了很多标准定义)vo ...

  2. Alamofire源码解读系列(七)之网络监控(NetworkReachabilityManager)

    Alamofire源码解读系列(七)之网络监控(NetworkReachabilityManager) 本篇主要讲解iOS开发中的网络监控 前言 在开发中,有时候我们需要获取这些信息: 手机是否联网 ...

  3. restful restAPI 的定义方式

    今天听了一些rest 的讲解,感谢玖遥老大教导,晚上把整理出来,帮助那些和我一样有过迷茫的人! 我举的例子是经过我的老大讲解,以及观看阮一峰的restful架构的一些整合,和自己的拙劣见解. 首先:每 ...

  4. 用Stax方式处理xml

    1.读取xml文件,首先用类加载器加载项目目录下的xml文件,从XMLInputFactory创建我所需要的XMLStreamReader,即得到了xml文件.根据XMLStreamConstant ...

  5. webstorm入手笔记

    一.webstorm学习前小记 webstorm是一款现在前端用的比较多的IDE,其优势也比较多,这个大家在网上随便搜搜就可以找到了.但是本人大部分的时间都是使用sublime text工作,最近由于 ...

  6. 如何进行SQL性能优化

    在SQL查询中,为了提高查询的效率,我们常常采取一些措施对查询语句进行SQL性能优化.本文我们总结了一些优化措施,接下来我们就一一介绍. 1.查询的模糊匹配 尽量避免在一个复杂查询里面使用 LIKE ...

  7. Android在listview添加checkbox实现单选多选操作问题

    android根据View的不同状态更换不同的背景http://www.eoeandroid.com/thread-198029-1-1.html android 模仿朋友网推出的菜单效果[改进版]h ...

  8. Codeforces Round #384 (Div. 2).C

    C. Vladik and fractions time limit per test 1 second memory limit per test 256 megabytes input stand ...

  9. nlog学习使用

    最近有不少朋友推荐我用NLog.我以前都是自己写txt的文本输出log,以前别人用log4net的时候看那个配置文件,看得我一阵烦,我比较喜欢约定胜于配置的组件.这次玩了一波NLog,,相当不错.一下 ...

  10. java基础--动态代理实现与原理详细分析

    关于Java中的动态代理,我们首先需要了解的是一种常用的设计模式--代理模式,而对于代理,根据创建代理类的时间点,又可以分为静态代理和动态代理. 一.代理模式                     ...