一、git:
分布式版本管理控制工具
开发人员的电脑,既可做服务器,也可做客户端
可以把代码共享到github备份,不用担心数据丢失问题
二、本地操作git
1.初始化项目仓库
在HBuilder中创建一个项目名为gitdemon,然后在这个项目右击打开文件所在目录,然后在空白处右击点击Git Bash here,再输入命令:git init。目的是初始化, 会在目录中生成一个.git文件。
2.创建项目html或者其他或者修改代码
3.查看某些文件或文件夹是否被git管理
命令:git status
3.1如果项目中有xxx.txt文件,是无用的文件,则使用命令:touch .gitignore 创建一个.gitignore文件,把不需要提交的文件路经(路经是根据.gitignore来说的)添加到.gitignore文件中(在HBuilder中不可见,在项目路经下可以打开修改)
3.将某个文件添加到本地的git上 被git管理
命令:git add 文件名
+:表示已经被添加到本地git上,还没有被提交到git的服务器上,说明已经被git管理了
4.批量添加某些文件被git管理
git add . 或 git add --all
6.提交被管理的文件到git服务器上
命令:git commit -m"日志";//日志必需写
7.修改文件,文件被修改后,先添加再提交
8.查看git版本日志信息:
命令:git log
9.回退某个版本
git reset --hard 695ebb(前六位哈希值,在日志中)
10.命令:git reflog 查看所有的日志
11.git reset --hard 695ebb 继续使用这个命令,退回到你想要的位置(后悔药)
三、分支
分支
主分支:master
a.查看分支
命令:git branch
b.创建分支
命令:git branch 分支名
c.切换分支:
命令:git checkout 分支名
d.创建并切换到某个分支
命令:git checkout -b 分支名
在项目中做一些修改,在主分支下是看不到,在这个分支下是可以看到的。合成分支,就可以在主分支上查看了。
e.在master上合并分支:(如果不在主分支上,需要切换到主分支上再作此操作)
命令:git merge 分支名
f.在master下的删除分支
命令:git branch -d new2
四、通过git操作github上的项目:
github git的服务提供商,通过github可以上传项目,项目可以通过github来管理
通过git操作github上的项目:
1.在github上创建一个项目仓库
然后直接按create repositiony创建即可
2.在你所需要的地方右击Git Bash here 。通过git克隆一个github仓库
命令:git clone https://github.com/ZhouGuanQi/myDemo.git
3.在有.get的目录下右击Git Bash here
在HBuilder中创建所要上传的项目添加到目录中
3.1如果项目中有xxx.txt文件,是无用的文件,则使用命令:touch .gitignore 创建一个.gitignore文件,把不需要提交的文件完全路经(路经是相对于.gitignore来说的)添加到.gitignore文件中(在HBuilder中不可见,在项目路经下可以打开修改)
4.git add .把项目添加到git中管理
5.git commit -m"添加了一个项目",提交到git服务器
6.git push -v origin master 在主分支master上以流的方式向github推送。就可在网页上Github中就可以看见你上传的项目。
7.输入github的用户名和密码
8.如果在线上修改了项目,线下同步线上:
命令:git pull origin master(这个可靠)
或:新建一文件夹用git clone命令重新克隆一个(这个不常用)
五、gulp 前端自动化工具--插件(grunt)
压缩--合并--复制粘贴
使用npm,npm是包管理器
gulp5个api:
1)task();
2)src();
3)pipe();
4)dest();
5)watch();
1.安装
先安装node.js环境(官网下载)
在cmd中输入node -v命令, 查看node安装版本
安装gulp以及所有的步骤:在cmd中输入命令
1)全局安装:npm install gulp -g
2)在HBuilder中创建gulpDemo项目目录, 打开项目所在 的目录,在路径中直接输入cmd,然后执行下一步
3)在目录下安装 在cmd中输入命令:npm install gulp --save-dve;
4)配置package.json文件命令: npm init -y
5)运行gulp:命令:gult
输出的是: No gulpfile found没有找到gulpfile这个文件
说明bulp所有任务都将在gulpfile文件下执行
在HBuilder手动创建gulpfile.js文件(建在项目名的一级 目录下)(必需是这个文件)
6)再运行gulp:命令:gult
输出的是: Task 'default' is not in your gulpfile
说明gulpfile.js中没有可执行的任务,于是就要在 gulpfile.js中编写代码
7) 1.引入glup模块 (gulpfile.js中编写代码)
var gulp = require("gulp");
2.在gulp下布置多个任务task();
gulp中的方法
task()布置任务
有三个参数:
第一个参数:任务名称 默认任务 default
第二个参数:该任务依赖的其它任务 是一个数组(可选)
第三个参数:任务回调函数(任务执行
gulp.task("default",function(){
console.log("default任务执行了");
})
gulp.task("task1",function(){
console.log("task1任务执行了");
})
gulp.task("task2",function(){
console.log("task2任务执行了");
})
8)启动执行
命令:gulp 任务名;(gulp task1)不写任务名,就默认 执行default任务。
多个任务一起执行:在默认任务的第二个参数以数组的方 式把其它需要执行的任务依赖注入进去 gulp.task("default",["say","dance"...],function(){
console.log("default任务执行了");
}) (数组里的顺序可以不用管)
再执行命令:gulp (执行时的顺序是,先执行数组里的, 在执行default)
9)布置一个任务,将src目录下的index.html文件复制到desth 目录下
src()源文件路径
pipe()管道输送
dest()目标目录
gulp.src("src/index.html").pipe( gulp.dest(目标目录) );
例子:gulp.task("copyhtml",function(){
gulp.src("src/index.html").pipe(gulp.dest("desth"));
})
10)布置一个任务:将lib目录下的所有js文件复制到js目录下
gulp.task("copyall",function(){
gulp.src("lib/*.js").pipe(gulp.dest("js"));
}) 11)src参数可以是一个数组
布置一个任务:将src下的css文件和lib下的css文件复制到dest目录下
gulp.task("copyall",function(){
gulp.src(["src/*.css","lib/*.css"]).pipe(gulp.dest("dest"));
})
12)gulp.src("lib/*")与gulp.src("lib/*/**的区别")
1.lib/*:代表lib下的所有一级目录的文件,不包含二级目录文件
gulp.task("copyall",function(){
gulp.src("lib/*").pipe(gulp.dest("dest"));
})
2.lib/**:代表lib下的所有文件,包含一级目录以及所有二级目录文件和多级目录文件
gulp.task("copyall",function(){
gulp.src("lib/**").pipe(gulp.dest("dest"));
})
3.lib/*/*.js:代表lib下的二级目录下的js结尾的文件,
gulp.task("copyall",function(){
gulp.src("lib/*/*.js").pipe(gulp.dest("js/js1"));
})
4.lib/*/*:代表lib下的二级目录下的的文件,不包括一级
gulp.task("copyall",function(){
gulp.src("lib/*/*").pipe(gulp.dest("js/js1"));
})
5.lib/*/**:代表lib下的二级目录下的所有文件(包括三级以及更多)不包括一级
gulp.task("copyall",function(){
gulp.src("lib/*/**").pipe(gulp.dest("js/js1"));
})
2.什么是gulp
gulp:前端自动化工具
作用(插件功能):
复制
自动化压缩js文件、css文件
自动压缩图片文件
自动合并文件
文件重命名
3.安装插件:在cmd中输出命令下面这些命令后,才可以压缩、重命名、合并
gulp-concat:npm install gulp-concat --save-dev //文件合并
gulp-cssmin:npm install gulp-cssmin --save-dev //css文件压缩
gulp-rename:npm install gulp-rename --save-dev //文件重命名
gulp-uglify:npm install gulp-uglify --save-dev //js文件压缩
//导入其他资源
var concat=require("gulp-concat");
var cssmin=require("gulp-cssmin");
var rename=require("gulp-rename");
var uglify=require("gulp-uglify");
//发布一个任务 ,
gulp.task("cssmin",function(){
return gulp.src("src/css1.css")
.pipe(cssmin())
.pipe(rename("index.min.css"))
.pipe(gulp.dest("htm1"));
})
//发布一个任务 ,
gulp.task("concat",function(){
return gulp.src("js/*.js")
.pipe(concat("pub.min.js"))
.pipe(uglify())
.pipe(gulp.dest("dist/js"))
})
4.每次修改代码都要执行,则我们用自动监听;s使文件自动执行更新.
//发布一个任务,任务监听其他任务的执行。
gulp.watch("任务源(也就是src)",["任务名"]);
gulp.task("watchall",function(){
gulp.watch(["src/index.hmtl","src/css1.css"],["copyHtml","cssmin"]);
})(任务源和任务名可以有多个,且顺序可以顺便,但是任务名有一个时,也要用[])