说明
由于不想按照vue文档上说的,起步学习。决定首先学习vue环境的搭建。
按文档上说的命令行的操作,相对简单一点,但是这样操作下去对环境
搭建的原理是不清楚的。俗话说好奇心害死人,于是就开始研究node等相关
知识了。
- 研究node
首先去看了朴灵
的深入浅出node,一头扎进入,觉得写的有点深,理解起来费劲,不适合我这种
刚入门的菜鸟。于是在各大论坛上问入门node的资料,感谢微信群里面的一个好友
分享了一个连接,名字叫nodejs保教不会,我用的那个连接是一个github仓库
地址,周末在家码字连接在公司,想知道的话直接百度就可以了。这个仓库里的
教程比较适合入门,但是读下来有点虎头蛇尾的感觉,想对node深入了解,那是
需要工作积累的,但是用于理解搭建前段的开发环境已经够了。
- 研究webpack
研究完node,只是对node的基本用法和npm版本和仓库管理有了初步的认识。
但是对于前端工程的打包,部署,测试等技术还是理解的不够深入。看了vue
的文档,要学习webpack,node学习完之后就立刻去学习了。学习的过程很简单
读了一篇很好的博客感兴趣的可以去好好读一下,相信用心读过之后对webpack技术会有一个比较
初步的了解。之前在公司经常用gulp,所以对我来说理解webpack也相对来说
容易了些。
-
开发工具,版本管理工具
这次开发工具接着用我经常使用的IntelliJ IDEA ,如果非得解释一下开发
vue也要用它的话,很简单:这个工具开发java很好用,我是java工程师嘛。
但是不仅仅是这些,这个工具对前端语言的支持一点也不差,就选它了。
版本管理就选git了,用完git再也回不到svn了。 -
在idea里面搭建环境
首先在github上创建仓库,用ideacheck到本地来,在idea 里面的
Terminal里面,在自己项目根目录下面运行如下脚本(运行如下脚本前要安装node和npm):
//设置npm仓库镜像为国内淘宝镜像
npm config set registry https://registry.npm.taobao.org
//查看配置是否成功
npm config get registryf
//全局安装webpack
npm install -g webpack
//全局安装 vue-cli
npm install-global vue-cli
//创建一个基于webpack模板的项目
vue init webpack my-project
//cd my-project,这一步会等很久
npm install
//这一步看着简单,实际上都在配置文件里面配好了,可以去研究一下
npm run dev
接下来我的浏览器就弹出了搭建成功后的首页,开心。从研究node到这一步用了
将近两个星期的时间,当首页弹出时还是很开心的,这对我来说就是乐趣所在。
加油