vue項目,代碼提交至碼云,iconfont的用法說明
一、前期準備
首先得有一個碼云賬號,賬號名最好是英文,用于線上倉庫
其次下載一個git到電腦,因為很多git命令,cmd命令行識別不了
最好再有一個Iconfont賬號,很多前端用到的圖標就不用再自己畫了,直接添加到項目下載下來就可以用了
還需要用到的有node
二、建立項目
1、首先在碼云上新建一個私有的項目(如果項目是共有的,那么所有人都能看見,一般設為私有,然后將項目組的人拉進來就可以了),使用READERME文件初始化這個項目,語言選擇javascript,克隆到本地
其中需要完成線上倉庫與本地的連接
2、接下來就可以在本地進行代碼的編寫了。
3、需要用到圖標時直接在iconfont中找到,加入購物車,添加進項目之后下載到本地,在組件中引用就行了。其中下載的文件只有部分是我們需要的,如下圖所示:
再將iconfont.css也復制進css文件夾即可
別忘記還要修改iconfont.css的路徑
三、提交代碼到碼云
主要想記載一下本地代碼的提交的一些命令
要提交代碼就得完成本地與線上倉庫的連接,這里是通過公鑰私鑰來進行連接的
1、生成公鑰私鑰
在項目文件夾下執行git命令(引號中為注冊碼云的郵箱地址)
`ssh-keygen -t rsa -C '[email protected]'`
2、一路Enter下去,然后將生成的公鑰填在碼云(設置-ssh公鑰)上
接下來輸入
cat ~/.ssh/id_rsa.pub
3、初始化git倉庫
在項目文件夾下執行git命令
git init
4 、將項目文件添加到緩沖區中
git add .
5 、將add的文件commit到倉庫
git commit -m ’project init’
6、連接碼云
這一步有可能會報錯,需要輸入命令
git config --global user.name 用戶名;
git config --global user.email 郵箱名;
7、上傳代碼到碼云倉庫
git push
四、遠端有項目的情況和碼云建立連接:
1.在本地創建一個文件夾 或 命令 mkdir + 文件名
2.命令cd + 文件目錄 進到文件名下
3.git clone + 碼云倉庫地址(碼云上新建項目點進去克隆或復制的鏈接)
五、一些git命令
查看所有分支 :git branch -a
切換到某一分支:git checkout 分支名稱
合并分支:git merge 原分支 目標分支
提交命令有兩個,git push origin master(正常提交)和git push origin master -f(強制提交,強制提交可能會把之前的commit注釋信息,不會改變修改的代碼,慎用),都是提交到master分支
查看遠程分支 git branch -a或git branch -r
創建本地分支 git branch demo_fenzhi
切換到本地分支 git checkout demo_fenzhi
刪除本地分支 git branch -d demo_fenzhi
查看本地分支狀態 git branch
創建遠程的分支,并且把本地分支推送到遠程分支上 git push origin demo_fenzhi:demo_fenzhi 本地分支名稱:遠程分支名稱
刪除遠程分支 git push origin :demo_fenzhi
或 git push origin --delete demo_fenzhi
本地分支與遠程分支比較 git diff demo_dev origin/demo_fenzhi
//demo_dev為本地分支,demo_fenzhi為遠程分支
新分支并切換到分支 git checkout -b bende_fenzhi
創建+切換分支:git checkout -b <name>
合并某分支到當前分支:git merge <name>
恢復刪除后未git add的文件 git checkout -f或git clean -df
可以把遠程某各分支拉去到本地的branchname下,如果沒有branchname,則會在本地新建branchname git fetch origin branchname:branchname
獲取遠程分支remoteName到本地新分支localName,并跳到localName分支 git checkout origin/remoteName -b localName
補充知識:vue項目在碼云預覽步驟
第一步:
需要將vue項目進行打包,即npm run build,打包完將dist文件夾push到碼云上,
但是注意將文件上傳到 GitHub的時候默認是忽略到dist文件夾的,所以需要修改.gitignore 中文件的內容。如截圖所示:
第二步:
登錄碼云,找到要預覽的代碼倉庫,操作如以下截圖所示,獲取部署后的網站地址,第三步的時候需要
第三步:
在vscode中,修改該項目下的config/index.js文件下的build部分的內容,如截圖所示:
修改完之后,重新執行npm run build命令,并且進行push
第四步:
在瀏覽器中輸入第二步時獲取到的網站地址,后面加上 /dist/index.html,即可進行網頁的預覽
大功告成!
以上這篇vue項目,代碼提交至碼云,iconfont的用法說明就是小編分享給大家的全部內容了,希望能給大家一個參考,也希望大家多多支持好吧啦網。
相關文章:
