vue入门

这篇博客介绍了如何搭建Vue.js的开发环境,包括安装Vue CLI和创建项目脚手架。通过命令行或图形界面创建项目,并在VSCode中进行开发。启动服务后,可以访问并测试Vue应用。此外,还提到了Vue的浏览器开发插件。

搭建运行环境

1.浏览器安装vue开发者插件(非必选)
2.安装node.js(含npm包管理器)
在这里插入图片描述
3.安装vue-cli

npm install -g @vue/cli

查看是否安装成功
在这里插入图片描述

创建项目脚手架

1.命令行创建(推荐配合vscode)

vue create hello-world

2.图形化界面创建

vue ui

脚手架文件结果说明
在这里插入图片描述

在这里插入图片描述
注意以上两种方式都需要在要创建项目的文件夹下cmd
创建成功!
在这里插入图片描述

vscode开发

使用vscode打开前面创建的项目脚手架
在这里插入图片描述
修改HelloWorld组件,在vscode输入终端输入npm run serve,可以启动服务
在这里插入图片描述
访问结果
在这里插入图片描述
按ctrl+c可选择终止访问服务
vue的浏览器开发插件
在这里插入图片描述

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值