Vue的使用以及IDEA安装Vue

学习之后,将自己所学习的知识记录整理下来,是一种极其有效的学习方法。
2009年,Ryan Dahl在谷歌的Chrome V8引擎基础上,打造了基于事件循环的异步IO框架:Node.js。随后,在node的基础上,涌现出了一大批的前端框架,vue.js就是其中之一。
所以,我们在使用Vue之前,先进行Node.js的安装,进入Node.js的官网。
Node.js官网:http://nodejs.cn/
第一步:进入官网。
第二步:选择对应的操作系统的版本,这里选择的是64位的windows版本。
在这里插入图片描述下载之后得到一个node-v12.14.0-x64.msi安装包,我们只需要双击这个安装包,一路next即可完成安装。
在这里插入图片描述第三步:进入cmd界面,可以通过一些命令来进行操作。

node -v

node -v查看node的版本。

npm -v

npm -v查看npm的版本。【安装完Node应该自带了npm】
在这里插入图片描述

npm install nrm –g

在控制台输入npm install nrm –g进行安装nrm。

安装完成后,可以使用nrm ls命令查看nrm所有的镜像。
在这里插入图片描述
由于网络环境的问题,我们选择使用taobao的镜像。

nrm use taobao

使用淘宝镜像。
在这里插入图片描述
我们可以使用进行测试是否成功。

nrm test taobao

显示使用淘宝镜像的网络环境为201ms,说明可以使用该镜像。
在这里插入图片描述
安装完Node之后,需要注意一个重点:
【注意】重启电脑
【注意】重启电脑
【注意】重启电脑

重启电脑之后,打开IDEA。
使用IDEA安装vue,我们先创建一个空的项目。
然后,在这个空的项目下创建一个静态web模块。
在这里插入图片描述在这里插入图片描述创建完毕项目与模块之后,我们需要做:
在IDEA的下方,打开Terminal界面,在项目所在的目录下,输入npm init -y初始化npm

npm init -y

在这里插入图片描述输入npm install vue –save安装vue

npm install vue –save

安装完成之后的界面如下图:
在这里插入图片描述到了这里,使用IDEA安装vue的工作就已经完成了,我们可以创建静态页面,在静态页面中引入:

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

即可开始使用vue了!

一切到此OK!

发布了6 篇原创文章 · 获赞 4 · 访问量 315

猜你喜欢

转载自blog.csdn.net/qq_45193304/article/details/103658634