手把手教你搭建Vue开发环境,也许你看过很多版本的脚手架安装教程,但还是容易出现各种问题,本文将带你走一条最快速的路,绕过很多坑
手把手教你搭建Vue开发环境,,希望对你有所帮助!
Hello,各位同学,好久不见,最近忙于琐事,拖更了0.0,也许你看过很多版本的脚手架安装教程,但还是容易出现各种问题,本文将带你走一条最快速的路,绕过很多坑,什么都不要说,什么都不要问,照着做,闲话少说,进入正题!
目录
用 [TOC]
来生成目录:
-
手把手教你搭建Vue开发环境,,希望对你有所帮助!
- 第一步:安装node,考虑到版本问题,这里建议下载最新版的node,进行安装(32位还是64位的自己选),附上地址:http://nodejs.cn/download/
- 第二步:安装cnpm,安装命令:npm install -g cnpm –registry=https://registry.npm.taobao.org
- 第三步:安装webpack,安装命令:cnpm install webpack -g
- 第四步:接着安装全局的vue-cli脚手架,用于帮助搭建所需的模板框架,安装命令:cnpm install -g vue-cli
- 第五步:安装完后,可以输入vue,然后回车,如果出现vue的信息,则说明安装成功了。
- 第六步:紧接着,就该创建项目了,自己找一个合适的地方,新建一个项目文件夹,根据自己的需要命名,我的命名为 demo,dos进入到该文件夹下,
- 第七步:创建项目,安装命令:vue init webpack demo然后回车到第五个,到第六个的时候输入y 然后再回车 如下
- 第八步:接着上一个再按n回车,再按n回车,再按n回车,如下,
- 第九步:接着上面一个按回车,项目正式开始创建,等一会,如下,
- 第十步:按照第9个图片里面的敲进去,如下(正常情况下端口是8080,由于我本机上面已经开着一个项目了,所以是8081),
- 第十一步:输入第十步的地址,就可以看见,至此,VUE的开发环境就搭建好了,
- 第十二步:关于VUE路由的使用,组件的分离,拓展的引入,等各种内容,将在下一节详细介绍,喜欢的小伙伴可以关注一下,点关注,不迷路
- END