常见开发需求之前端利器webstorm中的git和快捷键

需求

  前端开发中我们最常用的一般是webstorm、hbuilder和sublime，因为以前使用过一段时间eclipse所以我对webstorm的感觉比较良好，再加上以前使用hbuilder维护项目的时候其老是不明原因的崩溃和卡死，所幸后来我就把webstorm作为首选的开发工具了。今天一个朋友问我怎么在webstorm中使用git，我这里也攒了一些webstorm的使用小技巧，所幸就写篇记录文章吧。

导读

  读完这篇笔记你可以学到如下知识:

1.了解git和github的区别

2.学习如何使用webstorm中的git

2.1 如果电脑重装后，如何尽快让webstorm投入生产？

2.2 webstorm是不是自带了git？

2.3 刚进公司，给我个项目怎么配合着现有的ide和git去马上投入生产？

3.webstorm在项目开发中的常用快捷键

  老规矩，我这里也可以直接写如何在webstorm中去配置git，但我觉着那没毛线用，不如把基础打牢再去学配置来得好，如果项目中着急用，那就直接跳着看第三部分。

git和github

  很多做开发的朋友还在混淆一些概念，如git和github。git和github不是同一个概念，git是版本控制工具，而github可以简单理解为一个在线的网络资源分享的仓储地。
  

当我们使用git的时候，其实我们可以完全不使用github，当一个目录被git托管以后，会在当前目录下生成一个名为.git的隐藏目录，这时我们就可以对目录中的文件进行conmiit等操作，操作日志都会被记录到这个名为git的隐藏目录中，也就是git不需要联网，你的提交修改都会在本地进行记录，恢复也是从本地进行恢复的。但，这时候弊端就来了，若需要多人合作呢？若本地宕机，磁盘数据丢失呢？

  为了更好的解决楼上遇到的问题，github就出现了，通过push命令我们可以很方便的将本地修改的项目源文件以及日志提交到云端去，交由云端进行保存，而这里所谓的云端就是github，所以现如今我们总会把git和github放在一块去说，如图所示。。。

webstorm中git的配置及开发中常见的故障

  学习这个之前，首先要弄清楚一个概念：

我们为什么能直接在命令行键入git push等命令

  有人回答只要安装了相关程序并且在环境变量中配置了就ok，答案肯定是正确的，并且有人已经帮我们做好了这两步操作点我下载 git for window，当我们安装完这个程序以后在我们的pc中就可以使用命令行方式的git了，现在的问题就是怎么把他集成到我们的webstorm中。

  之前我朋友问我怎么在git上使用webstorm，我说你先安装git，然后用webstorm自带的插件用一下就ok，点点鼠标的问题，他说先试试，最后他给我的结论是他反问我，我没安装git啊？我已经把项目拉下来了。我说好吧，解决问题了就成。那现在问题来了，webstorm中到底有没有集成git，答案是否定的，他之所以能直接拉下来是因为在他安装webstorm之前电脑中已经安装过git了，所以他可以直接这么用，我们都知道webstom上点点鼠标的问题，在git bash中都是对应一个个的命令滴。试问在没有git的情况下你点点鼠标能起作用吗？

  如何将你本机的git和webstorm关联呢？正常情况下只要先安装git再使用webstorm就不需要考虑到这个问题，可是有一种情况就会造成webstorm的git无端失效，那就是当系统崩溃或者重装以后，git环境变量丢失，这时候我们需要来到webstorm菜单下的settings设置中来重新配置一下git路径,如图。

  

ok，若你出现了这个故障，你就这样恢复，若没有略过就好。

给你一个github地址，如果导入到webstorm中

  刚进公司，我就知道几个简单的git命令，刚接触这个项目文档么有，肿么办？负责人说，那你就拉下项目先熟悉熟悉吧？嗯，问题怎么配合着webstorm拉？我只会用命令把他拉到本地的文件夹啊，貌似这么做也行，但你下次提交怎么办？多人pusll怎么办？也用命令？你在webstorm中开发完然后再打开相应文件夹去提交？

  解决方法其实比较简单，只要该项目导入的时候是以git方式导入的，那么对这个项目的后续操作就都是git的方式勒，我们就可以直接在该文件的编辑框中点击右键选择git对该文件进行提交，如图所示，届时所有的操作就都移交给了webstorm，开发效率大大提高。。

webstorm中常用的快捷键

  上面提到过，若给你一个没有文档的项目且文件之间的关联紧密繁多你该如何？这时候就需要用到全局搜索，就是定位一个关键字或者关键词出现在哪个文件中，我们使用ctrl+h快捷键。

  如果文件嵌套很深，如index.html这个文件在a目录下的b文件夹下的c文件夹中，你想要马上打开这个文件该怎么办?我们可以按两下shift键，然后打开搜索框搜索相应的文件名就可以。

  如果我们要同时选中多个不同的文字将他改为同一个关键字你该如何做？替换？替换针对的只是选中相同的关键字，此刻我说的是不同，比如选中字母a和字母b将他替换成c，这时候我们可以使用alt+双击关键字的方法。

  如果你想把a替换到b位置，想把c替换到d位置，且是高频热替换，你该怎么做？傻傻的每次去分别复制a和c然后放到b和d的位置吗？明显效率低下，我们可以使用ctrl+shift+v打开剪贴板，有选择性的进行粘贴，如图。

  上一次我是在a文件中查看了200行的代码，现在我在b文件中查看第300行代码，这两处代码有逻辑上的关联，但是我却忘记了上一次我在何处看了代码，怎么回到a文件的200行呢？我们可以使用alt+左方向键。

结尾

  webstorm的其他快捷键网上一搜一箩筐而且对于大多数人来说甚为常见，大家需要的自行搜索就可以，我们公司后端使用java，碰巧eclipse的快捷键也能映射到webstorm中，为了和后端一统，所以上文中我提到的ctrl+h指代的是eclipse映射过来的快捷键。

映射方式：file->settings->keymap 即可。