Mac 安装Vue步骤

因新项目要求使用Vue 记录下安装流程

1.访问node.js官网:https://nodejs.org/en/下载对应安装包。
node.js下载
2.安装完成,在终端输入 :
node -viterm2
如果返回版本号,代表安装成功。建议安装之前给目录权限,至于怎么给目录权限,这里不做说明,网上有很多资料。

3.安装淘宝镜像
前端安装完node后,最好设置下淘宝的镜像源,
不建议使用cnpm(可能会出现奇怪的问题)废话少说,在终端输入:
npm install -g cnpm --registry=https://registry.npm.taobao.org
安装完成输入:
npm -v
npm -v
查看版本号,正确返回代表安装完成,否在重新来过。

4.安装webpack
以后我们会和webpack打很长时间的交道,创建项目会用到。
安装 webpack,以全局的方式安装,在终端输入:
cnpm install webpack -g

5.安装vue脚手架
这个工具是自动搭建vue项目框架的工具,还算好用,没得选只此一家。
终端输入:
sudo npm install -g vue-cli

6.等待一段时间,安装完成后,在终端输入:
vue list
在这里插入图片描述

查看详细信息,返回如下代表成功,否则重来。

创建首个vue项目

1.在Mac中创建文件夹,名称自己起,然后在终端打开该目录,也可以用vscode 打开,在终端输入:

sudo vue init webpack vue_project

坐等安装完成。

2.安装成功后切换到在终端中切换到项目根目录

cd vue_peoject

3.安装项目依赖,在终端中输入:

sudo npm install

4.安装依赖完成后,启动项目,在终端或者vscode终端输入:

npm run dev

5.访问http://localhsot:8080,打开vue项目
vue
到这里,vue项目已经可以正常运行了。

命令使用sudo ,是因为文件权限很是让人头痛
不加这个命令,会出现各种莫名的问题
为了减少麻烦,索性都加上,确保万无一失。
  • 2
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
安装mac上的vue脚手架的步骤如下: 1. 首先,确保你的电脑上已经安装Node.js。你可以在终端中输入`node -v`来检查是否已经安装Node.js,并查看其版本号。 2. 打开终端,使用npm安装vue脚手架。在终端中输入以下命令: ``` npm install -g @vue/cli ``` 这将全局安装vue脚手架。 3. 安装完成后,你可以使用以下命令来检查vue脚手架是否成功安装: ``` vue --version ``` 如果成功安装,你将看到vue的版本号。 4. 创建一个新的vue项目。在终端中进入你想要创建项目的目录,然后输入以下命令: ``` vue create 项目名称 ``` 其中,项目名称是你想要给你的项目起的名字。 5. 在创建项目的过程中,你可以选择使用默认配置或者手动选择配置。根据你的需求进行选择。 6. 创建完成后,进入项目目录: ``` cd 项目名称 ``` 7. 启动项目。在终端中输入以下命令: ``` npm run serve ``` 这将启动开发服务器,并在浏览器中打开你的项目。 这就是在mac安装vue脚手架的步骤。希望对你有帮助!\[1\] #### 引用[.reference_title] - *1* *2* [Vue(四)Vue脚手架——手把手教你安装和使用](https://blog.csdn.net/io_123io_123/article/details/122610993)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^control,239^v3^insert_chatgpt"}} ] [.reference_item] [ .reference_list ]

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值