Mac安装vue
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的更多相关文章
- Mac安装vue.js开发环境
Mac安装vue.js开发环境 DannyHooDanny的专栏订阅 一.vue.js开发环境 二.初始化一个vue.js项目 三.vue.js项目打包部署 本来以为在Mac上搭建vue.js的环境挺 ...
- MAC安装vue.js
一.下载node node下载地址:https://nodejs.org/en/download/ 下载后点击安装即可. node -v 检查安装是否成功 二.安装 淘宝镜像 (npm) npm in ...
- mac安装vue没有使用权限不足
➜ ~ vue init webpack frontend ⠋ downloading template /usr/local/lib/node_modules/vue-cli/node_modul ...
- Mac安装vue产生错误
npm WARN checkPermissions Missing write access to /usr/local/lib/node_modules/webpack/node_modules/_ ...
- mac安装vue-devtools
mac安装vue devtools 1.到github下载vue tool 的压缩包 正常的方法:git clone https://github.com/vuejs/vue-devtools 但事实 ...
- mac上安装vue项目
mac上如何安装vue项目 一, mac系统安装brew /usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/H ...
- Mac OS X下安装Vue脚手架(vue-cli)
前言 Vue作为前端三大框架(Angular,React,Vue)之一,号称是最简单,最容易上手的框架,同时也是行内的大趋势,还可以用来开发最火的小程序.具有开发快,双向数据流等特点,有些人认为Vue ...
- Mac 安装node npm cnpm vue 以及卸载 node 和 npm 的方法 清空npm缓存的方法
S01 安装node(内含npm) 首先,到官网下载长期支持版,截止目前,最新的长期支持版本号是10.16.3 https://nodejs.org/zh-cn/download/ 下载完毕后,安装该 ...
- 运行vue项目--安装vue脚手架vue cli
第一步. 安装node: 官网下载node的.pkg,下载地址,选择相应版本进行下载 mac终端下输入npm -v 和 node -v, 出现相应版本号即安装成功. 若均提示 command not ...
随机推荐
- linux命令学习笔记(9):touch 命令
linux的touch命令不常用,一般在使用make的时候可能会用到,用来修改文件时间戳,或者新建一个不存在的文件. .命令格式: touch [选项]... 文件... .命令参数: -a 或--t ...
- 转载 解决Android与服务器交互大容量数据问题
对于目前的状况来说,移动终端的网络状况没有PC网络状况那么理想.在一个Android应用中,如果需要接收来自服务器的大容量数据,那么就不得不考虑客户的流量问题.本文根据笔者的一个项目实战经验出发,解决 ...
- python中如何定义main方法
我们有时写的python模块需要自己测试, 简单方法就是定义main函数, 然后测试自己的模块接口. def main(): test_yourCode() if __name__ == & ...
- shell ## %% 使用说明
path='apps/home/usr/app/test.txt' a=${path##*/} b=${path#*/} c=${path%%/*} d=${path%/*}············· ...
- Poj1163 The Triangle(动态规划求最大权值的路径)
一.Description 7 3 8 8 1 0 2 7 4 4 4 5 2 6 5 (Figure 1) Figure 1 shows a number triangle. Write a pro ...
- 九 fork/join CompletableFuture
1: Fork/join fork/join: fork是分叉的意思, join是合并的意思. Fork/Join框架:是JAVA7提供的一个用于并行执行任务的框架,是一个把大任务分割成若干个小任务 ...
- js---复选框(全选,不选,反选)demo1--
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/stri ...
- ParentViewController中添加SubViewController(IOS学习)
我是用的是Container.addSubView的方法. 1. ParentViewController.m的@interface()中添加2个子vc的实例变量,代码如下 @property (no ...
- C/C++中变量类型最值之宏定义
C/C++ [climits(limits.h)] CHAR_BIT Number of bits for a char object (byte) ...
- 查看Linux、Tomcat、JAVA版本信息
查看Linux.Tomcat.JAVA版本信息 [root@test1 bin]# cd /usr/local/tomcat/tomcat_jdt/bin/ [root@test1 bin]# sh ...