搭建第一個vue項目


第一:你需要在Windows環境下面搭建vue的開發環境,具體可參考如下的地址:

https://www.cnblogs.com/zhaomeizi/p/8483597.html

第二:當你搭建好之后,你可以看見網上許多的創建項目的,大部分使用webstorm,但是他這個創建的是一個簡易的項目,大致的項目目錄如下:

 

 

 

這個時候是不是發現你和網上的對比是不是少了點什么,是不是沒有一些文件夾,那么(個人推薦,大神勿噴)以后我們這樣建項目:

1:進入你自己的項目目錄(這個目錄是自己建的):

 

 

 2: 創建一個項目名:vue init webpack demoTest

 

 

 這里是我碰到的一個坑,記着;項目名不可以大寫:

 

 

 變成這樣:

 

 

之后先按照這個區操作:

 

 

 等待:

 

 

 現在說明剛剛叫你選擇(Y/N)是干嘛的:

         Install vue-router ==> 是否要安裝 vue-router,項目中肯定要使用到 所以Y 回車;

    Use ESLint to lint your code ==> 是否需要 js 語法檢測 目前我們不需要 所以 n 回車;

    Set up unit tests ==> 是否安裝 單元測試工具 目前我們不需要 所以 n 回車;

    Setup e2e tests with Nightwatch ==> 是否需要 端到端測試工具 目前我們不需要 所以 n 回車;

3:進入新項目目錄,安裝依賴:cnpm i

 

 

4 啟動項目:npm run dev

 

 出現這個就代表建好了,現在可以在瀏覽器里面先訪問一下:

 

 5:接下來就是使用我們的webStorm打開剛剛的項目:

 

 是不是比之前直接建的多了一些目錄,這些目錄其實你自己也可以手動建立

 6:自己創建頁面:

 

 6-2:

 

 

 

 

 

 

上面的vue標識不想要可以自己在后台給他注釋掉

至此,一個簡單的vue項目時創建好了

 

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM