mac 安装 vue

技术 · 2019-12-11

安装步骤
安装node
首先,在 node.js 官方下载文 下载最新的Mac installer
下载node.js
然后,双击下载的安装包开始安装node,安装完毕后,打开terminal(终端),查看安装的node版本,在窗口内输入

$ node -v
node版本
查看npm版本:

$ npm -v
4.2.0
安装webpack
因为在mac下依赖包要写入系统重要文件夹里,需要先获取root权限所以现在terminal(终端)内输入

$ sudo -s
窗口内出现🔑图标,输入电脑管理员密码(此时不会有任何反馈)并点击回车,就获取root了。

获取到root
获取到root后,就可以通过npm在全局安装webpack了。在terminal(终端)内输入以下代码即可开始安装webpack:

$ npm install webpack -g
安装成功样式:

webpack安装成功
安装vue-cli
在terminal(终端)内继续输入以下代码即可开始安装。
$ npm install webpack -g vue-cli
安装成功样式:

vue-cli安装成功
安装成功后,查看vue基本信息

查看vue基本信息
使用vue list查看vue的模板了,在terminal(终端)内继续输入以下代码,即可查看vue list

$ vue list
vue list 详情
生成项目
在terminal(终端)内继续输入以下代码,即可使用webpack 模板生成一个vue的项目。
$ vue list
按照 vue list 中提示的方式,创建名称为《testicy》的vue项目

$ vue init webpack testicy
生成vue项目
生成过程需要填写一些基本信息,如项目名称、项目描述、是否需要安装vue-router、unit test单元测试和ese tests。

进入项目和安装依赖
$ cd testicy
进入项目目录,查看当前目录结构。

$ npm install
安装成功后,会发现多了一个node_modules目录。如果安装报错,就试试加上sudo

$ sudo npm install
启动项目
$ npm run dev
项目启动成功后,终端弹窗内会开启listening模式,系统会自动在浏览器中打开localhost:8080,查看页面效果。

Theme Jasmine by Kent Liao