Vue.js入門(一)之腳手架@vue/cli創建vue項目

  其實Vue的官方文檔 Vue.js官方文檔 寫的已經非常詳盡了,我個人認爲關於Vue.js的基礎教學視頻和博客其實都是多餘的.我無意冒犯很多同行以及前輩的整理和踩坑,我想表達的是,一個合格的開發者應該從文檔入手學習和使用一項你從來沒使用過的技術,一方面是任何技術的周邊,包括視頻和博客其實都是官網的搬運工,另一方面,爲了提高學習和開發效率,對於Vue這種文檔支持較好的前端框架,我們只看文檔就夠了,也許看文檔你已經搭建出來一個簡單項目並且開始寫頁面了,但是看視頻可能得需要看半個小時纔開始動手,兩者對比,一目瞭然.

 筆者這個系列的文章,一是做整理記錄,二是希望給一些入門編程的人提供一些前車之鑑,消除對陌生技術的恐懼感.

 不積跬步,無以至千里,不積小流,無以成江海.我們要對前輩和大神保持尊重和謙卑,但我們無需自卑.

筆者這篇文章默認你已經安裝了NodeJs 並且對npm install 和 npm uninstall 有了基本認識和使用.

接下來就和我一起跟着官方文檔來用官方腳手架創建一個Vue項目吧.

一 安裝腳手架

打開網址 Vue 腳手架安裝 你會看到下面的頁面

 

 

這裏有一點需要注意,就是如果你已經安裝了Vue cli2那麼你需要先把它卸載掉再安裝Vue cli3 

 如果你 輸入 vue --version 能看到相關的版本信息,那麼接着往下看.

二 創建項目

和vue cli2創建項目的命令有所不同,vue cli3(即@vue/cli)使用的命令是

 vue create 項目名

①首先先在你的工作目錄中創建一個空文件夾,進入它,(用命令行方式操作) 然後輸入 vue create 你的項目名 回車

 

選擇手動配置特性 回車

 

接下來,它提示你手動選擇一些插件,按空格鍵選中或取消勾選 選擇完自己想要的插件之後按回車

 

 接下來,它會詢問說,你上面選擇的這些插件,我把它們配置到哪裏,是配置在指定的配置文件中還是package.json? 我一般選擇package.json,當然你自己指定也可以

 

按回車,然後它問你,需要把這個項目保存成一個模板項目(方便以後你使用)嗎,需要輸入y不需要就輸入n回車,

然後等它開始創建項目 .

創建成功如下圖

 

它會提示你,進入項目目錄,運行yarn serve

如果你不知道yarn是啥,進入項目目錄之後運行 npm run serve 回車就ok了. 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章