zoukankan      html  css  js  c++  java
  • git上传文件到github与gulp的简单使用

    git有两种方式提交源代码到github 第一种方式通过地址提交下面介绍的是通过ssh方式上传

    git使用ssh方式上传代码到github
    git首先要生成公钥和私钥 将公钥添加到github中将私钥保存在本地
    + 命令:`ssh-keygen -t rsa`生成的公钥与私钥文件会在当用户目录的.ssh目录下.


    把代码push到服务器时需要先pull一下(pull的作用是从远程下载git项目里的文件,然后将文件与本地的分支进行merge)

    git pull和gitclone区别:git pull 的话默认没有设置origin这个变量,必须自己手动设置git remote add ...而git clone 默认origin这个变量的存在

    在pull之后如果远程的代码与本地的代码有冲突,git会先自动合并冲突,如果不能自动合并,就必需我们手动去处理冲突。

    如果本地没有.git目录,需要先初始化一下。
    命令:`git pull [远程服务器地址] [远程的分支]`

    gh-pages分支-搭建博客.
     需要把自已博客的网页代码上传到github上的gh-pages分支
     然后就可以直接访问了
    访问的url形式: [github用户名].github.io/[仓库的名字]/[具体的页面]

     npm
    官网[https://www.npmjs.com]
    node package manager
    初始化:`npm init`
    安装指定包:`npm install jquery --save`
    删除指定包:`npm remove jquery --save`
    下载安装package.json中dependencies属性对的文件:`npm install --production`

    browser-sync
    更改代码之后自动刷新浏览器
    需要使用npm进行全局安装:`npm install browser-sync -g`,-g表示安装到全局
    使用:`browser-sync start --server --files "./index.html,app.css,./css/*.css,*.*" `
    - --files参数指定要监视的文件,后面跟要监视的文件的文件路径以逗号分隔。

    gulp
    [官网](http://www.gulpjs.com)
    [中文网](http://www.gulpjs.com.cn)

    - 前端自动化构建工具
    js压缩,var x,xname,混淆
    合并.
    css压缩
    html压压缩

    第一步:安装gulp

    ‘npm install -g gulp-cli’必须保证全局安装了gulp

    第二步:在当前文件夹执行‘npm init -y’初始化

    第三步:在当前文件夹安装gulp:“npm install gulp --save-dev” 注意文件夹名不能为gulp

    第四步:创建一个文件名为‘gulpfile.js’的文件 在这个js文件中写gulp

    第五步: 在cmd中运行自己写的gulp执行命令"gulp 任务名"

    例如:

    插件下载方式

    ‘npm install --save-dev gulp-uglify’

    “npm install --save-dev gulp-concat”

    “npm install --save-dev gulp-htmlmin”

    .......

    在gulpfile.js中可以这样写

    // 得到gulp对象
    var gulp =require("gulp");
    // 下载js压缩混合插件
    var uglify =require("gulp-uglify");
    // 下载合并代码插件
    var concat =require("gulp-concat");
    // 下载css压缩混合插件
    var cssnano = require("gulp-cssnano");
    // 下载html压缩插件
    var htmlmin = require("gulp-htmlmin")
    // 创建一个js任务
    gulp.task("js",function(){
    gulp.src(["js.js","index.js"])
    .pipe(concat("all.js"))
    .pipe(uglify())
    .pipe(gulp.dest("./dist"))
    });
    // 创建一个css任务
    gulp.task("css",function(){
    gulp.src(["css.css","index.css"])
    .pipe(concat("all.css"))
    .pipe(cssnano())
    .pipe(gulp.dest("./dist"))
    })
    // 创建一个html任务
    gulp.task("html",function(){
    gulp.src("index.html")
    .pipe(htmlmin({collapseWhitespace:true})) html方法不同于其他两个方法需要使用参数 参数值只能是布尔值
    .pipe(gulp.dest("./dist")) dist处理过后的文件存放的目录
    })


    核心就5个方法
    task,gulp中是一个个任务的形式来实现功能。
    task('任务名',function(){
    .....
    });
    - src
    + src('./*.js')
    - dest('./minjs/')// 指定处理后的文件的输出路径.
    - watch('./*.js',['任务名1','任务名2']);
    - run('任务名');//执行指定的任务.

    - 对js代码进行压缩 gulp-uglify
    - 对代码进行合并 gulp-concat
    - 对css进行压缩 gulp-cssnano
    - 对html进行压缩 gulp-htmlmin

  • 相关阅读:
    a链接获取方法
    调用百度地图API搜索地名和关键词
    页面定时跳转
    amazeui 上传文件
    数组删除多个元素的方法
    synology git 服务器问题处理
    公司和家里代码文件同步方案: (git和dropbox实现)
    前端项目, 每次运行都需要输入 sudo 的解决方法
    git revert 让提交不再害怕
    建立自己的键盘栈(shortcutkeyStack)
  • 原文地址:https://www.cnblogs.com/bicycle-lei/p/6407540.html
Copyright © 2011-2022 走看看