說明
由於不想按照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到這一步用了
將近兩個星期的時間,當首頁彈出時還是很開心的,這對我來說就是樂趣所在。
加油