移动互联网的爆发以及响应式页面的尴尬症,开发web和mobile项目成为了标配,当然实际情况下,会有更多的项目。

多项目开发对于前端来说是个很大的挑战
✦ 重复,重复的前端架构,重复的前端依赖,重复的工具函数等
✦ 局限,不同后台有不同的规则,“因地制宜”真难受,刚伺候好rails又突然来个php
✦ 最优,后台工程做前端构建,总是显得不够“最优”。

所以,我们需要单独抽离出前端开发项目,按照前端的方式来组织代码,通过构建工具来对前端资源文件做最优处理
那么新问题来了,如何管理这个快速迭代,频繁更新的前端项目呢?
✦ 作为单独的项目管理?
✦ 用git submodule or git subtree管理?

多个后台项目:qdaily4_web/moible/app
前端项目:qdaily4_feboierplate

之前的开发模式

✦ 在qdaily4_feboierplate项目中修改前端代码
✦ 构建qdaily4_feboierplate项目,输出到qdaily4_web/mobile/app
✦ 提交qdaily4_feboierplate项目的改动
✦ 在qdaily4_web/mobile/app项目中修改后台代码
✦ 提交qdaily4_web/mobile/app项目的改动,其中包括qdaily4_feboierplate项目构建输出的文件

这种开发模式解耦了前端项目和后台项目,前端项目严格按照前端的代码结构去组织代码,能够实现模块化,按需加载,就近原则,图片压缩等功能。缺陷在于需要频繁的切换项目提交代码。

为了解决频繁切换项目的问题,调研了git submodule和git subtree之后,选择用git subtree来解决这个问题。

现在的开发模式

qdaily4_feboierplate作为qdaily4_web/mobile/app的子项目,别名appfe
✦ 在appfe项目中修改前端代码
✦ 构建appfe项目,输出到qdaily4_web/mobile/app
✦ 提交qdaily4_web/mobile/app项目的改动(也会记录appfe项目的改动)
✦ 使用git subtree命令提交appfe的改动到qdaily4_feboierplate

引入git subtree之后,不再感觉是在开发两个项目,不需要频繁的切换项目提交代码,只需要使用git subtree命令就可以实现qdaily4_feboierplate项目的双向更新,快速开发。缺陷在于存在多个qdaily4_feboierplate项目的拷贝。

双向更新

前端项目qdaily4_feboierplate是作为子git被包含到多个后台项目中,我们通过git subtree pull & git subtree push实现qdaily4_feboierplate的双向更新,对于不稳定且需要快速迭代的模块代码恰到好处。

利用git subtree来管理前端模块项目和多个后台环境项目,可以有效快捷的实现前端模块项目快速开发,双向更新,配合上前端构建系统,简直爽翻了。

小技巧

git仓库取别名

使用appfe作为git@bitbucket.org:qdaily/qdaily4_feboierplate仓库的别名
✦ 直接命令行输入:

git remote add appfe git@bitbucket.org:qdaily/qdaily4_feboierplate.git

✦ 也可以通过配置.git/config文件:

[remote "appfe"]
url = git@bitbucket.org:qdaily/qdaily4_feboierplate
fetch = +refs/heads/*:refs/remotes/appfe/*

git指令自定义

git subtree pull 和 git subtree push 是需要频繁使用的命令,我们可以通过自定义来让git指令更简单更好记

✦ 直接命令行输入

git subtree pull --prefix=appfe appfe master
git subtree push --prefix=appfe appfe master

✦ 也可以配置.git/config让git subtree的命令更简单
!:表示外部命令而不是git命令,相当于直接在shell中运行!后的组合命令。
$1:表示shell传进来的第一个参数,比如git stpull demo/xxx,那么$1就是demo/xxx
::组合命令尾部的:很神奇,没有它,最后一个指令不会运行,所以它起到一个占位的作用。
第二版Tip:
✦ 可以看出,如果当前分支没有stash的东西,这个组合命令会出现问题,还未想到解决方案,有了解的人可以留言指出。

// 第二版
// git stpull demo/xxx
// git stpush demo/xxx
[alias]
stpull = !git stash \
&& git subtree pull --prefix=appfe appfe $1 \
&& git stash pop \
&& :
stpush = !git stash \
&& git subtree push --prefix=appfe appfe $1 \
&& git stash pop \
&& :

第三版Tip:
✦ 放弃了stash,让用户自己去处理stash相关的事情。
✦ 使用两个参数,表示子项目目录和分值名称,这样可以兼容处理多个子项目,不同分支的情况。
✦ 使用git subtree split --rejoin,解决了每次提交都需要重头遍历commits耗时过长的问题。
✦ 每次git subtree push之前都先git subtree pull,是为了解决错误时机git subtree split导致push失败。
✦ 初次运行时,远端没有demo/xxx分支,需要使用git subtree push -P appfe demo/xxx新建远端分支。

// 第三版
// git stpull appfe demo/xxx
// git stpush appfe demo/xxx
[alias]
stpull = !git subtree pull --prefix=$1 appfe $2 \
&& :
stpush = !git subtree pull --prefix=$1 appfe $2 \
&& git subtree split --rejoin --prefix=$1 $2 \
&& git subtree push --prefix=$1 appfe $2 \
&& :

自定义git指令对于一些常使用的长命令很有效,强烈建议使用!

学习过程中遇到什么问题或者想获取学习资源的话,欢迎加入学习交流群
343599877,我们一起学前端!

git subtree:无缝管理通用子项目的更多相关文章

  1. git subtree有效管理公共第三方lib

    如果你的项目中有很多第三方的lib,你希望使用它,并且也希望可能对该lib做修改并且贡献到原始的项目中去,或者你的项目希望模块化,分为几个repo单独维护,那么git subtree就是一个选择.gi ...

  2. git subtree pull 错误 Working tree has modifications

    git subtree 是不错的东西,用于 git 管理子项目. 本文记录我遇到问题和翻译网上的答案. 当我开始 pull 的时候,使用下面的代码 git subtree pull --prefix= ...

  3. 使用Git Subtree在多个项目中共用同一个子项目

    转载请注明原文地址:http://www.cnblogs.com/ygj0930/p/8427796.html 场景一:已有一个大项目,需要把其中一部分内容独立出来作为共用子项目,被其他项目引用 一: ...

  4. git subtree模块化代码管理

    Git Subtree 的原理 首先,你有两个伟大的项目——我们叫他P1项目.P2项目,还有一个牛逼的要被多个项目共用的项目——我们叫他S项目.我们通过简要讲解使用Subtree来同步代码的过程来解释 ...

  5. 使用GIT SUBTREE集成项目到子目录(转)

    原文:http://aoxuis.me/post/2013-08-06-git-subtree 使用场景 例如,在项目Game中有一个子目录AI.Game和AI分别是一个独立的git项目,可以分开维护 ...

  6. Git subtree和Git submodule

    git submodule允许其他的仓库指定以一个commit嵌入仓库的子目录. git subtree替代git submodule命令,合并子仓库到项目中的子目录.不用像submodule那样每次 ...

  7. git subtree用法(转)

    git subtree用法 一.使用场景 例如,在项目Game中有一个子目录AI.Game和AI分别是一个独立的git项目,可以分开维护.为了避免直接复制粘贴代码,我们希望Game中的AI子目录与AI ...

  8. 使用git进行源代码管理

    git是一款非常流行的分布式版本控制系统,使用Local Repository追踪代码的修改,通过Push和Pull操作,将代码changes提交到Remote Repository,或从Remote ...

  9. VS2015 Git 源码管理工具简单入门

    1.VS Git插件 1.1 环境 VS2015+GitLab 1.2 Git操作过程图解 1.3 常见名词解释 拉取(Pull):将远程版本库合并到本地版本库,相当于(Fetch+Meger) 获取 ...

随机推荐

  1. POJ3415:Common Substrings——题解

    http://poj.org/problem?id=3415 给定两个字符串A 和B,求长度不小于k 的公共子串的个数(可以相同). 论文题,和上道题(POJ2774)类似,首先想到现将AB串合并,然 ...

  2. BZOJ1486:[HNOI2009]最小圈——题解

    https://www.lydsy.com/JudgeOnline/problem.php?id=1486 https://www.luogu.org/problemnew/show/P3199 题面 ...

  3. CF1073E Segment Sum 自闭了

    CF1073E Segment Sum 题意翻译 给定\(K,L,R\),求\(L\)~\(R\)之间最多不包含超过\(K\)个数码的数的和. \(K<=10,L,R<=1e18\) 我 ...

  4. 洛谷 P3644 [APIO2015]八邻旁之桥 解题报告

    P3644 [APIO2015]八邻旁之桥 题目描述 一条东西走向的穆西河将巴邻旁市一分为二,分割成了区域\(A\)和区域\(B\). 每一块区域沿着河岸都建了恰好\(1000000001\)栋的建筑 ...

  5. iOS开发ARC机制下的内存管理技术要点

    转载一篇: iOS开发ARC内存管理技术要点.ARC内存管理原则总结.iOS ARC内存管理总结 ARC内存管理机制 (一)ARC的判断准则: 只要没有任何一个强指针指向该对象,该对象就会被释放. ( ...

  6. Java八种基本数据类型的大小,以及封装类,自动装箱/拆箱的用法?

    参考:http://blog.csdn.net/mazhimazh/article/details/16799925 1. Java八种基本数据类型的大小,以及封装类,自动装箱/拆箱的用法? 原始类型 ...

  7. javascript常用实例的实现与封装

    地址:https://github.com/chenhuiYj/ec-do 2.字符串操作 2-1去除字符串空格 //去除空格  type 1-所有空格  2-前后空格  3-前空格 4-后空格 fu ...

  8. Java中的String为什么是不可变的? — String源码分析

    原文地址:http://www.importnew.com/16817.html 什么是不可变对象? 众所周知, 在Java中, String类是不可变的.那么到底什么是不可变的对象呢? 可以这样认为 ...

  9. DIV CSS display(block,inline,none)的属性教程

    display:inline.block.inline-block的区别 display:block就是将元素显示为块级元素. block元素的特点是: 总是在新行上开始: 高度,行高以及顶和底边距都 ...

  10. [freemarker篇]05.关于集合的遍历

    人啊,有的时候就是没有办法坚持一些事情,总是因为各种理由在推脱,逐渐就变成了拖延症!例如胖先生的减肥计划,其实本来就没有计划,属于散漫形式的!一直减肥,一直在肥!总是说没有时间,没有时间!其实有时候就 ...