Windows环境下Vue的安装和第一个Vue项目开发

Windows环境下Vue的安装和第一个Vue项目开发


Vue是前端三大框架之一,下面从零开始搭建第一个Vue项目。

1.进入node.js官网下载相应版本安装包:https://nodejs.org/en/
笔者推荐稳定版本
Windows环境下Vue的安装和第一个Vue项目开发
2.正常安装到自己想放的文件目录即可
Windows环境下Vue的安装和第一个Vue项目开发
此处勾选第一项
Windows环境下Vue的安装和第一个Vue项目开发
3.上面安装过程中已自动配置了环境变量和安装好了npm包,此时打开cmd(命令提示符)分别输入 node -vnpm -v 分别查看node和npm的版本号。
Windows环境下Vue的安装和第一个Vue项目开发

4.使用指令npm install vue -S安装Vue
Windows环境下Vue的安装和第一个Vue项目开发
注意 !此时文件的位置在C盘(C:\Users\豪哥哥),你可以根据自己的需要,放到不同的文件目录下,相应的,在该文件目录下会生成一个名字为node_modules的文件夹。
Windows环境下Vue的安装和第一个Vue项目开发
5.创建自己的Vue项目。
打开node_modules文件夹,内部有一个vue文件夹,我们所开发的项目就和vue文件夹处于同一级目录。
Windows环境下Vue的安装和第一个Vue项目开发

6.在第一个项目文件(html)引人Vue的包,若是按照我上面的方法放置文件路径,那么引用vue的路径如下图所示。
Windows环境下Vue的安装和第一个Vue项目开发

7.至此,Vue的安装和第一个项目已经全部完成