前端学习02-Vue-介绍&HelloWorld

本文详细介绍了如何安装Node.js并配置npm镜像,以及使用npm初始化Vue项目的过程。从环境变量设置到vscode中项目的创建,再到Vue.js依赖的安装,最后实现helloworld示例。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

首先安装环境node.js

下载好了双击安装 ,如果安装出错了的话,就断网,离线安装

再次双击这个文件就可以看到有卸载的按钮了

装好了后,环境变量有显示的

文件夹

CMD窗口

然后配置npm使用淘宝镜像,输入npm config set registry http://registry.npm.taobao.org/

这些出现就代表node.js安装好了

然后在 vscode打开vue工程

新建文件夹,然后选中

使用npm初始化这个项目,输入 :  npm init -y

发现vscode报错说不是内部或外部命令,不是已经安装好了node.js吗,在CMD的窗口下也执行好了啊,npm命令明明可以执行啊,为啥这就不行了,然后心塞了,就度娘了,说是要重启电脑,然后就默默的流着眼泪重启电脑了,心里一千匹...

重启后,果然就可以了,真的是应了那句梗,重启可以解决80%的问题

出现这两个内容,就说明使用npm初始化项目成功了

出现了package.json,代表了是npm来管理的项目

 

到vue官网教程

使用npm

然后在vscode里面也执行 npm install vue命令,安装vue依赖

 

出现这些就表示安装好了,控制台也没报错

然后创建一个index.html,然后在右边输入感叹号!,会有提示,直接第一个回车

出现如下

下面引入vue.js

<script src="./node_modules/vue/dist/vue.js"></script>

接下来看helloworld

可以看到取值成功了

F12输入vm.name直接出现值

可以对其进行修改,然后页面的值也可以进行修改,敲完vm.name='李四',然后直接回车,页面进行修改了

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值