1.GitLab網上使用
-
兩種登錄方式
-
通過Http登錄,需要用戶名和密碼
-
通過SSH登錄,不需要用戶名和密碼只需要RSA密鑰就行,RSA通過在git bash中輸入 ssh-keygen -t rsa生成,生成好的密鑰通過生成的路徑找到對應的id_rsa.pub文件,將其內容添加到gitlab中並保存ssh密鑰,以后的push 或者pull操作都不會需要用戶名和 密碼。
-
-
克隆倉庫
-
git clone 你的地址(這里可以通過https地址或者通過SSH方式獲取你的網上倉庫)
-
-
獲取倉庫內容
-
git pull 地址/origin master 可以通過https地址獲取倉庫數據,但是這樣做太麻煩了,使用origin相當於替換了之前的地址用法都是一樣的。
-
其實這樣使用包含了兩個操作
-
git fetch origin (獲取遠端的分支)
-
git merge origin/master (合並遠端分支)
-
-
-
遠端分支管理
-
創建遠端分支
-
1.在本地創建好分支以后,本地 push 該分支即可
-
2.在網頁上創建分支好以后,通過git fetch獲取該分支
-
-
刪除遠端分支
-
git push origin --delete 需要刪除的分支,那么其他人如果需要更新分支 需要 git fetch -p
-
-
git 補充知識
-
保存當前的工作現場
-
使用git stash保存當前的工作現場,那么就可以切換到其他分支進行工作,或者在當前分支上完成其他緊急的工作,比如修訂一個bug測試提交。
-
1 在通過git add 提交完代碼到緩存區以后 輸入git stash 保存現場,完成以后通過創建其他分支或者跳轉其他分支解決對應的工作
-
2 解決完對應的工作后跳轉到之前的工作分支中在通過 git stash pop 還原現場
-
-
-
查看隱藏分支 git branch -a
-
2.Node
-
什么是Node
-
Node.js 是一個基於 Chrome V8 引擎的 JavaScript 運行環境
-
-
Node.js(難道是類似於jQuery的js文件)
-
chrome瀏覽器的JS引擎(V8引擎)
-
javascript組成
-
ECMAScript 基本語法
-
DOM
-
BOM
-
-
node 只解析ES,像aler()之類的就不能使用了
-
加上谷歌V8對js的解析速度大大提高
-
提供了一些系統級API,比如對文件的操作
-
其實就是一個js運行環境
-
-
安裝Node
-
不要安裝在中文路徑
-
nvm Node Version Manager(版本管理)
-
nrm Node Registry Manager(路徑管理)
-
npm Node Package Manager (依賴包管理)www.npmjs.com npm下載地址
-
-
常用nvm命令
-
nvm ls 查看node下載的版本
-
nvm install 4.6.0 下載名為4.6.0的版本
-
nvm use 4.6.0 切換4.6.0版本
-
-
常用nrm 命令
-
nrm ls查看不同的下載源地址
-
nrm use cnpm 切換到cnpm下載源
-
-
常用的npm命令
-
npm init 初始化一個 package.json 文件,如果加上-y就不需要在敲回車了
-
npm install -g bower 全局安裝bower
-
npm install jquery --save-dev 本地安裝jquery並記錄到package.json中
-
npm uninstall 包名 刪除包 如果是全局安裝就加上-g
-
3.Bower
-
什么是bower
-
bower是一個前端的管理工具,主要用來管理前端的包例如:Jquery、BootStrap、Angular等。
-
有人會有疑問為什么npm也是管理工具我還要學習bower管理工具?
-
原因很簡單,因為就像有迅雷下載你為什么還要用QQ旋風、電驢、快車下載,其實原因都一樣因為npm在某些時候不能滿足用戶需求那么市場上就會出現替代產品。
-
-
bower網站
-
如何使用bower進行管理
-
安裝Bower:npm install -g bower
-
創建包bower.json:bower init
-
安裝各種包文件:bower install < package>,如下載jquery: bower install jquery ,bower install jquery#1.8.0 選擇下載1.8.0版本
-
卸載包文件:bower uninstall < package>
-
包搜索:bower search <package>
-
包版本:bower info <package>
-
修改Bower安裝位置:在項目根目錄下創建.bowerrc然后添加以下內容`{
"directory": "vendor"//這里是指定包安裝路徑,加完以后記得刪除這條注釋
}`
-
-
4.Gulp
-
什么是gulp
-
用自動化構建工具增強你的工作流程!
-
-
什么又是自動化構建
-
當一個項目足夠大的時候,我們會采按功能划分給不同的人員開發,進一步各個功能又會划分成不同的模塊進行開發,這就會造成一個完整的項目實際上是由許許多多多的“代碼版段”組成的;我們開發中又會用到less、sass等一些預處理程序,需要將這些預處理程序進行解析;為了減少請求需要將css、javascript進行合並;為了加速請求需要對html、css、javascript、images進行壓縮;這一系列的任務完全靠手功完成幾乎是不可能的,需要借助構建工具才可以實現。所謂構建工具是指通過簡單配置就可以幫我們實現合並、壓縮、校驗、預處理等一系列任務的軟件工具。
-
-
不同的構建工具
-
常見的構建工具包括:Grunt、Gulp、F.I.S(百度出品)
-
-
gulp的優點
-
易於使用通過代碼優於配置的策略,Gulp 讓簡單的任務簡單,復雜的任務可管理。
-
構建快速利用 Node.js 流的威力,你可以快速構建項目並減少頻繁的 IO 操作。
-
插件高質Gulp 嚴格的插件指南確保插件如你期望的那樣簡潔高質得工作。
-
易於學習通過最少的 API,掌握 Gulp 毫不費力,構建工作盡在掌握:如同一系列流管道。
-
-
入門指南
-
-
全局安裝 gulp:
$ npm install --global gulp-cli
-
-
-
作為項目的開發依賴(devDependencies)安裝:
$ npm install --save-dev gulp
-
-
-
在項目根目錄下創建一個名為 gulpfile.js 的文件: ` var gulp = require('gulp'); gulp.task('default', function() { // 將你的默認的任務代碼放在這}); `
-
-
-
運行 gulp:
$ gulp
-
-
-
gulp示例代碼· gulp.task('image', function () {return gulp.src('./images/*', {base: './'})
.pipe(imagemin()) .pipe(gulp.dest('./dist'));
}); ·
-
gulp插件庫:
[官網地址](http://gulpjs.com/plugins/) [npm也能找到gulp插件](https://www.npmjs.com/)
-
常用插件gulp-autoprefixer(css加前綴)https://www.npmjs.com/package/autoprefixer`//通過require引用gulpvar gulp = require('gulp');var autuprefixer=require('gulp-autoprefixer');//添加css前綴gulp.task('cssautuprefixer',function () { //通過src獲取到需要的css文件 //*表示全部匹配 //pipe管道 起到一個承前啟后的作用 //dest輸出結果 gulp.src('./css/*.css')
.pipe(autuprefixer()) .pipe(gulp.dest('./dist/css'));
});`
gulp-uglify(最小化 js 文件)https://www.npmjs.com/package/gulp-uglify `//最小化jsgulp.task('uglify',function () { gulp.src('./js/*.js', {base: './'})
.pipe(uglify()) .pipe(gulp.dest('./dist'))
});`gulp-htmlmin(壓縮html文件)https://www.npmjs.com/package/gulp-minify-html`//壓縮html頁面gulp.task('htmlmin',function () {
gulp.src('./*.html', {base: './'}) .pipe(htmlmin({ collapseWhitespace: true, removeComments:true, minifyJS:true, })) .pipe(gulp.dest('./dist'));
});`gulp-imagemin(最小化圖像)https://www.npmjs.com/package/gulp-imagemin`//壓縮圖片gulp.task('imagemin',function () {
gulp.src(['./images/*.jpg','./images/*.png'], {base: './'}) .pipe(imagemin()) .pipe(gulp.dest('./dist'))
});