VS Code做項目的筆記


需要自己研究的東西:http://www.bootcss.com/

畫頁面時的布局插件:http://blog.chinaunix.net/uid-22414998-id-2878529.html

 

 

vsCode用lic創建項目:https://www.cnblogs.com/z45281625/p/9015380.html

使用vue-cli快速構建項目 

 vue-cli 是vue.js的腳手架,用於自動生成vue.js模板工程的。 安裝vue-cli之前,需要先安裝了vue和webpack

 

· node -v                   //(版本低引起:bash: npm: command not found) 
· npm -v                   //以上幫助檢查是否安裝 node npm      
· 輸入vue                    //測試vue是否安裝成功
· 輸入vue list               //看vue中有哪些子類 npm install vue
· npm  install  -g vue-cli            // 全局安裝vue-cli
·  vue init webpack projectName      // 生成項目名為projectName的模板,這里的項目名projectName隨你自己寫 (是的話 敲回車就行)
                     // 默認情況下,webpack安裝的是最新版本的,如果要安裝其他版本,使用命令行vue init webpack #1.0 ***就可以了。
 
注意:淘寶鏡像語句,安裝后npm速度更快,用的時候將npm都改成cnpm               

在安裝時會詢問你: 

①、Project name (sanfeng1);項目名稱(sanfeng1)。(確定按enter,否按N) 

②、 Project description (A Vue.js project);項目描述(一vue.js項目)。(隨意輸入一段簡短介紹,用英文) 

③、Author (sunsanfeng);作者(sunsanfeng)。(確定按enter,否按N) 

④、Vue build (Use arrow keys)> Runtime + Compiler: recommended for most usersRuntime-only: about 6KB lighter min+gzip, but templates (or any Vue-specificHTML) are ONLY allowed in .vue files - render         functions are required elsewhere;Vue公司的建立(使用箭頭鍵)>運行時+編譯器:大多數用戶推薦運行時間:約6kb輕民+ gzip,但模板(或任何Vue具體HTML)只允許在。VUE文件渲染功能是必需的其他地方。(按enter) 

⑤、Install vue-router? (Y/n);安裝的路由?(/ N)。(可安可不安,以后也可以再安,根據需求選擇) 

⑥、Use ESLint to lint your code? (Y/n);使用ESlint語法?(Y/ N)。(使用ESLint語法,就要做好心理准備,除非你非常懂ESLint語法,要不就會處處報錯,我就被逼瘋過,建議N) 

⑦、Setup unit tests with Karma + Mocha? (Y/n);設置單元測試?(Y / N)。(選N) 

⑧、Setup e2e tests with Nightwatch? (Y/n);Nightwatch建立端到端的測試?(Y / N)。(選N)

此時會生成一個 projectName 的文件夾,這個文件夾就是vue的項目模板

· cd  projectName         // 進入文件目錄              
· npm  install                    // 初始化安裝依賴
· npm run dev         //運行, 在瀏覽器打開http: //localhost :8080,則可以看到歡迎頁了。
 
(講的很細我覺得個人沒有必要再添油加醋)
 
后面部分是個人盲點
 

但是這個只能在本地跑,要如何在我們自己的服務器上訪問呢?

· npm run build 

 

會生成靜態文件,在根目錄的dist里,里面有個index.html,這是服務器訪問的路徑指定到這里就可以訪問我們自己的項目了。

模板默認是run build 命令,如果提示沒有找到命令就需要去配置文件里尋找build指令

有時候生成的index.html里引用的css和js的引用路徑不對,這時候就需要自己修改一下。 例如改為:config/index.js 

 

 

此處運行報錯  因為上面的創建項目的方式是vue-cli2.0的方式   無法用cnpm run serve指令來運行

(所以后來者如果看到我這篇博客  請前往官網查找新建項目方法  別百度)

怎樣升級自己的vue-cli版本

最近我用vue創建項目的時候報了一個我vue版本過低的錯誤,我本地是2.6,而最新的版本是2.8.1,然后在網上找升級vue版本的方法,找了好久都找不到,所以記錄一下方便別的小朋友。

npm install --global vue-cli     或者使用cnpm這樣快一些

或者使用 cnpm install --global vue-cli 也是可以的

這樣全局安裝 vue-cli一下,npm就會把你vue的版本提升到最新版本

 


免責聲明!

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



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