Vue学习之初始化脚手架

本文介绍了如何使用@vue/cli初始化Vue项目。首先全局安装@vue/cli,然后在目标目录下创建项目,选择Vue2版本。遇到下载问题可尝试删除并重新创建,通过npm run serve启动服务,访问http://localhost:8080/查看效果。解决下载缓慢问题,可配置npm淘宝镜像。

初始化脚手架

第一步(仅第一次执行):全局安装@vue/cli
npm install -g @vue/cli
在这里插入图片描述
这里的warn是脚手架本身存在的,不用管,安装完成后,重新启动命令行输入vue,不报错则成功安装
在这里插入图片描述
第二步:切换到你要创建的项目目录,然后使用命令创建项目,不要一上来就输入命令,要修改目录
命令为: vue create xxx(项目名)
在这里插入图片描述
进行选择
在这里插入图片描述
这里我选择的vue2
创建
在这里插入图片描述
注:出现下载过慢或者出现停止问题,我在这里删掉了原文件重新创建了就好了

然后进入项目目录输入 npm run serve
成功界面
在这里插入图片描述
在浏览器输入 http://localhost:8080/ 出现以下页面表示成功
在这里插入图片描述

注:不要关闭以下页面,如果打不开可以重复一遍进入项目目录输入 npm run serve
在这里插入图片描述

注意:
1、如果出现第一步下载缓慢请配置npm淘宝镜像:
npm config set registry http://registry.npm.taobao.org
在这里插入图片描述
2、Vue脚手架隐藏了所有webpack相关的配置,若想查看具体的webpack配置,执行命令: vue inspect > output.js

评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值