一.用到的一些快捷鍵:
a.打開cmd: win+R
b.進入d盤:d:
c.進入d盤某個文件夾:cd myVue
d.退回上一級:cd..
二.Vue安裝工作:
1.vue的安裝依賴於node.js,要確保你的計算機上已安裝過node.js。
a.可進入cmd編輯器,輸入命令 node -v進行查看。出現版本信息即成功!沒有則從瀏覽器上面下載安裝即可;
b.沒有安裝要求!官網地址:https://nodejs.org/en/ ,注意安裝建議全局安裝,不要自己建立地址,自己建立也行,只不過需要自己去配置變量,否則會出現'npm' 不是內部或外部命令,也不是可運行的程序 或批處理文件這個問題;
c.如果以前裝過需要重新安裝,在彈出選擇框的時候選擇remove即可。
2.確定node安裝后,就可以開始vue的安裝了。可進入cmd編輯器,輸入命令 vue -V進行查看,出現版本信息即成功,否則則按照下圖進行按照。
3.我們需要建一個Vue項目,建立在c盤外用來存放自己的項目,,別盤進行建立!
4.如圖安裝中途出現的問題:
a.在cmd里輸入:vue init webpack my-project(項目文件夾名,可自行命名),回車,等待一小會兒,依次出現‘git’下的項,可接着操作,按提示依次輸入文件名,項目名,作者等,等出現vue-router路由時輸入yes,其他的輸入no,回車即可!
b.安裝依賴:npm install 博主出現了很多次問題,顯示錯誤,一直解決不了,搜索了很多博客也沒有什么看得懂的解決方法,后來找到一種,就是全局安裝cnpm;
npm install -g cnpm --registry=https://registry.npm.taobao.org
c.然后在cmd中輸入cnpm install,即安裝成功,cnpm run dev 或者在瀏覽里輸入:localhost:8080(默認端口為8080),即能在瀏覽器中看到已經安裝好的vue!
三.GitHub代碼托管使用方法:
1.獲取項目
1.在Git官網下載git進行安裝,地址https://git-scm.com/;
2.安裝教程可在網上進行搜索,一般直接確定即可(建議全局安裝,就是不自己設立地址);
3.然后使用GitHub的話,在網上找到項目,然后項目有給到附加地址,在D盤建立文件夾,右鍵,然后就能看到安裝好的git,選擇Git Bash Here,點擊即會出現類似與cmd的框,進行輸入地址導入即可!
比如餓了么項目:
git clone https://github.com/bailicangdu/vue2-elm.git cd vue2-elm npm install 或 yarn(推薦) npm run dev
4.中途出現的問題:
a.出現 listen EADDRINUSE :::8000,這表示端口被占用;
b.解決辦法:打開項目config文件夾下面的index.js文件,然后更改端口號即可;
dev: { env: { NODE_ENV: '"development"' }, port: 8090,//此處 assetsSubDirectory: 'static', assetsPublicPath: '/', context: [ //代理路徑 '/shopping', '/ugc', '/v1', '/v2', '/v3', '/v4', '/bos', '/member', '/promotion', '/eus', '/payapi', '/img', ],
2.上傳項目
1.注冊GitHub賬號,官方地址:https://github.com/
2.在Git官網下載git進行安裝,地址https://git-scm.com/;
3.登錄github,然后點擊右上角“+”,選擇“New repository”,然后在出來的頁面“Repository name”處,輸入你的項目名稱,接着在‘Description (optional)’處,輸入介紹文字(隨意),然后,可以看到一個正方形的選擇框,選中,然后點擊‘Create’按鈕,進行創建,這個時候,你會跳到你創建的項目地址;
4.打開此電腦,選擇一個盤,比如 f 盤建立一個文件夾,右鍵空白處點擊 git bash here。
5.然后把你剛剛建立的項目地址克隆出來,比如輸入命令:
git clone https://github.com/youname/text.git
6.克隆成功后,你會發現,你在f盤建立的那個文件夾里面多了一個項目。然后打開有個README.md的文件,這個時候你就完成了;
7.現在還沒有結束,現在你需要把你的想上傳的項目內容復制到這個文件夾里面來,比如html,js文件等等;
8.好,復制完成之后,你輸入命令。進入d盤這個項目文件夾,比如cd text;
9.然后,輸入命令:git add . (注意有個點) //添加遠程不存在的git文件
10.接着,輸入命令:git status //查看本地自己修改了多少文件 這時會出現一片綠色;
11.然后,我們需要提交修改,這時,我們輸入命令:git commit -m "modify" ;如果git彈窗出來要你登錄,你就登錄你的github賬號,如果提示please tell me who you are,這時候你要驗證你的身份,提示也就是需要你登錄一下,確認你的身份,但是不要按照其提示輸入,先輸入命令git config user.name “username”,換行輸入git config user.email “email” (名稱和郵箱是你github的),然后你就可以重新輸入命令git commit -m "modify"了;
12.提交修改完成后,我們要更新,輸入命令:git pull;
13.然后,我們需要更新到遠程服務器上,輸入命令:git push,出現100%即提交成功,這時你登錄你的github就能看到你提交的項目了;
四.vue開發軟件vsCode安裝:
1.在vsCode官網下載進行安裝,地址https://code.visualstudio.com/;
2.然后,我們下載的默認是英文版,我們需要把它修改為中文版:
a.打開軟件,輸入快捷鍵Ctrl+Shift+p,會出現一個搜索框;
b.在搜索框中輸入“configure display language”;
c.修改locale.json文件下的屬性“locale”為“zh-CN”;
d.重啟vscode工具;
注:如果重啟之后還是英文環境,則點擊左側第五個圖標-商店,然后搜索Chinese(Simplied) Lang,安裝即可。安裝完成后重新打開即可。