Mac安装vue

一、安装brew
打开终端运行以下命令:

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

配置brew环境变量

Taojie:~ apple$ open .bash_profile
Taojie:~ apple$ source .bash_profile

添加brew路径如下:

装成功后,查看一下brew的版本信息:

Taojie:~ apple$ brew -v
Homebrew 2.1.
Homebrew/homebrew-core (git revision 5c8b; last commit --)
Taojie:~ apple$

二、安装node.js

在终端中运行以下命令:

Taojie:~ apple$ brew install nodejs

安装成功后,查看一下node.js的版本信息:

Taojie:~ apple$ node -v
v12.4.0
Taojie:~ apple$

3、获取nodejs模块安装目录访问权限

Taojie:~ apple$ sudo chmod -R  /usr/local/lib/node_modules/
Password:
Taojie:~ apple$

4、安装 淘宝镜像 (npm)

Taojie:~ apple$ npm install -g cnpm --registry=https://registry.npm.taobao.org

5、安装webpack

Taojie:~ apple$ cnpm install webpack -g

6、安装vue脚手架

Taojie:~ apple$ cnpm install vue-cli -g

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

Taojie:~ apple$ cd /TJT/vue
Taojie:vue apple$ ls
Taojie:vue apple$

8、根据模板创建项目

Taojie:vue apple$ vue init webpack-simple vue1
会有一些初始化的设置,如下输入:
Target directory exists. Continue? (Y/n)直接回车默认(然后会下载 vue2.0模板,这里可能需要连代理)
Project name (vue-test)直接回车默认
Project description (A Vue.js project) 直接回车默认
Author 写你自己的名字


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

Taojie:vue apple$ cd vue1
Taojie:vue1 apple$
注意:最后三步都是要进入到当前工程目录后执行的。

9、安装项目依赖

Taojie:vue1 apple$ cnpm install

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

Taojie:vue1 apple$ cnpm install vue-router vue-resource --save

11、启动项目

Taojie:vue1 apple$ npm run dev

安装OK后,访问http://localhost:8080如下:

 三、在webStorm中启动vue项目:

1、Run In Terminal

2、在终端输入启动命令 npm run dev

Taojie:src apple$ npm run dev

> vue1@1.0.0 dev /TJT/vue/vue1
> cross-env NODE_ENV=development webpack-dev-server --open --hot Project is running at http://localhost:8081/
webpack output is served from /dist/
404s will fallback to /index.html
{ parser: "babylon" } is deprecated; we now treat it as { parser: "babel" }.

Windows下安装vue:

https://www.cnblogs.com/liluxiang/p/9592003.html  他山之玉可以攻石

Mac安装vue的更多相关文章

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

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

  2. MAC安装vue.js

    一.下载node node下载地址:https://nodejs.org/en/download/ 下载后点击安装即可. node -v 检查安装是否成功 二.安装 淘宝镜像 (npm) npm in ...

  3. mac安装vue没有使用权限不足

    ➜  ~ vue init webpack frontend ⠋ downloading template /usr/local/lib/node_modules/vue-cli/node_modul ...

  4. Mac安装vue产生错误

    npm WARN checkPermissions Missing write access to /usr/local/lib/node_modules/webpack/node_modules/_ ...

  5. mac安装vue-devtools

    mac安装vue devtools 1.到github下载vue tool 的压缩包 正常的方法:git clone https://github.com/vuejs/vue-devtools 但事实 ...

  6. mac上安装vue项目

    mac上如何安装vue项目 一, mac系统安装brew /usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/H ...

  7. Mac OS X下安装Vue脚手架(vue-cli)

    前言 Vue作为前端三大框架(Angular,React,Vue)之一,号称是最简单,最容易上手的框架,同时也是行内的大趋势,还可以用来开发最火的小程序.具有开发快,双向数据流等特点,有些人认为Vue ...

  8. Mac 安装node npm cnpm vue 以及卸载 node 和 npm 的方法 清空npm缓存的方法

    S01 安装node(内含npm) 首先,到官网下载长期支持版,截止目前,最新的长期支持版本号是10.16.3 https://nodejs.org/zh-cn/download/ 下载完毕后,安装该 ...

  9. 运行vue项目--安装vue脚手架vue cli

    第一步. 安装node: 官网下载node的.pkg,下载地址,选择相应版本进行下载 mac终端下输入npm -v 和 node -v, 出现相应版本号即安装成功. 若均提示 command not ...

随机推荐

  1. bzoj-2458 2458: [BeiJing2011]最小三角形(计算几何+分治)

    题目链接: 2458: [BeiJing2011]最小三角形 Time Limit: 10 Sec  Memory Limit: 128 MBSubmit: 1101  Solved: 380 Des ...

  2. ACM学习历程—HDU5475 An easy problem(线段树)(2015上海网赛08题)

    Problem Description One day, a useless calculator was being built by Kuros. Let's assume that number ...

  3. docker-ce安装与搭建私有仓库

    https://www.cnblogs.com/sszhou/p/7389144.html 系统环境centos7 ###docker-ce安装###1.卸载老版本,较老版本的Docker被称为doc ...

  4. 查看Linux内核版本的命令

    方法一: 命令: uname -a  作用: 查看系统内核版本号及系统名称  方法二:  命令: cat /proc/version 作用: 查看目录"/proc"下version ...

  5. C语言计算日期间隔天数的经典算法解析

    #include <stdio.h> #include <stdlib.h> int day_diff(int year_start, int month_start, int ...

  6. delphi 线程教学第三节:设计一个有生命力的工作线程

    第三节:设计一个有生命力的工作线程   创建一个线程,用完即扔.相信很多初学者都曾这样使用过. 频繁创建释放线程,会浪费大量资源的,不科学.   1.如何让多线程能多次被复用?   关键是不让代码退出 ...

  7. shell入门-tr替换字符和split切割大文件

    命令:tr 说明:替换字符 格式tr ‘原字符’ ‘新字符’ 可以是范围字符,指定字符 命令:split 选项:-b 50m 1.txt  根据大小分割 单位是b不用单位,单位是兆加m -l 100 ...

  8. Ok6410裸机驱动学习(二)ARM基础知识

    1.ARM工作模式 ARM微处理器支持7种工作模式,分别为: l  用户模式(usr):ARM处理器正常的程序执行状态(Linux用户态程序) l  快速中断模式(fiq):用于高速数据传输或通道处理 ...

  9. shell判断网络主机存活

    判断网络主机存活企业面试题4:写一个脚本,实现判断10.0.0.0/24网络里,当前在线用户的IP有哪些(方法有很多) #!/bin/sh#[ -f /etc/init.d/functions ] & ...

  10. Servlet编程实例 续2

    -----------------siwuxie095 Servlet 跳转之请求的重定向 继续完善登录实例,如下: login.jsp 不变,修改 LoginServlet,新建两个 JSP 文件 ...