初識vue.js，個人學習之路（一）

       在之前作項目時常常是新建一些html、css、等一些文件，但在接觸了vue.js以後我發現我已經有點看不懂前端了，這對於我這麼一個菜鳥來講實在是很苦逼的事情。如今的前端技術都離不開npm包去管理編譯流程，npm是node.js的包管理工具，vue腳手架的搭建也是須要npm進行操做，因此學習vue以前必需要了解node.js。重點是npm的安裝與使用，那麼首先咱們就要下載一個node.js.

       1、安裝node.js

   能夠直接到node.js的官網下載安裝，選好跟本身電腦對應的系統版本進行安裝，安裝過程也沒什麼說的就是一直下一步，若是你會安裝QQ，那麼你必定會安裝node.js。

   安裝完以後打開本身的命令行工具（若是你問我命令行是什麼怎麼打開，請出門左拐），輸入 node-v和npm-v 若是能顯示出版本號就說明安裝成功了。

      2、vue腳手架的搭建

  安裝完node以後咱們就可使用npm安裝 vue-cli了，直接全局安裝。

                          npm install vue-cli -g                                            

  由於使用npm下載東西訪問的是外網須要 翻 牆 速度會很慢，因此推薦你們使用國內的良心淘寶鏡像，也就是cnpm來進行安裝。

  可自行進入cnpm的官網，可是要注意一點安裝完cnpm以後必定要使用 cnpm-v 查看版本號，不然有可能會安裝不成功。cnpm的使用就是把npm換成cnpm便可。

  安裝完vue-cli以後就是vue項目的搭建了

 3、搭建項目

            vue init wepack demo1  或者 vue init  webpack-simple demo1        

      其中demo1是項目的名字，這個你能夠隨便取 aaa、bbb均可以，那麼webpack與weppack-simple有什麼區別呢？其實基本上沒有什麼區別，可是你用webpack的話它會有代碼格式的檢查，不符合它的標準就會報錯，若是你想讓本身的代碼看上去工整養成這個習慣，你就用webpack。除此以外兩種生成的配置文件名稱也不同，一個是index.js，一個是webpack.config.js。

                                               

 

運行命令以後一直回車、回車，可是不要太猛，中間會問你是否須要sass？你能夠要或者不要。

而後下面會提示你怎麼作   cd demo1 進入項目文件，npm install 安裝項目依賴，執行 npm run dev 自動打開頁面。

                                       出現這個界面那就大功告成了！