那些能提高开发效率的工具

本文旨在分享一些提高开发效率、编程幸福感的工具，共两部分内容：

• Vscode 插件
• 其他工具

Vscode 插件

插件	作用
Auto Close Tag	自动补齐闭合标签，如 Vue 中写自动变成
Auto Rename Tag	改标签名时闭合标签跟着改
Auto Import	根据你用到的变量、函数等自动提示需要导入的模块
Prettier	格式化 / 美化你的代码，可以格式化带 jsx 的 React 代码，需要在 Vscode 右下角将 js 文件自动关联为 javascriptReact 格式
Bracket Pair Colorize	给不同层级的括号加不同的颜色，方便你分清代码结构
Chinese (Simplified) Language Pack for Visual Studio Code	让你的 vscode 变成中文界面
ESLint	不了解 lint 规则的最好先别下，这里推荐 airbnb 的 lint 规则使用。lint 是一个保证代码质量的工具，使用它可以使你的代码保持在良好的规范里，当你书写不合规范的代码时，它会通过警告来提示你
各类snippet插件（Vue、React 等）	用简短的字母来打出一大段代码
cssrem	一个 CSS 值转 REM 的 VSCode 插件
File Utils	用键盘快捷键来快速创建新的文件/文件夹
Import Cost	在你引入模块的那行代码最后显示该模块的体积大小
Path Intellisense（以及搜索intellisense出来的各种插件）	填写路径时提供智能提醒
TODO Highlight	写代码时突然有灵感想记下来，或者有疑问想标记一下？你需要这款 TODO 插件

其他工具

• emmet: 一种快速书写 html 代码的规则

  div*3 ===
  <div></div>
  <div></div>
  <div></div>

• snippet：代码片段

  • 善用代码片段能大大提高你的编程效率

  • 如：装了React(React-Native/React/Redux snippets for es6/es7)这一插件后，写 react 代码：

    • imrc = import React, { Component } from 'react'

    • imrd = import ReactDOM from 'react-dom'

• 更好的终端（命令行）软件：oh-my-zsh

• 更好的 markdown 编辑器：Typora

• 程序员专用字体：Fira Code

结语

近来发现了自己在写代码时的短板：

• 逻辑思维能力  不够强，遇到逻辑比较复杂的 js 代码，如多层的条件判断，就比较懵逼。

我认为这个问题不是短期内能解决的，于是就想了个曲线救国的方法，那就是提高我的开发效率，这样就能空出更多的时间来  解决那些逻辑复杂的代码。

我可真是个小机灵鬼( ´▽ ｀)