代码格式化是一个在软件开发过程中值得一提的话题。
所谓代码格式化就是说,程序员在书写代码的过程中或者完成代码开发后对代码书写格式排版的调整,使得已经完成的代码变的更美观整洁也更具有可读性,也能增加完成代码后的成就感。
很多时候代码格式化的功能甚至都被认为是一个评价IDE或者编辑器好坏的主要标准。
不过今天的话题是代码的自动格式化,当你了解到代码的自动格式化功能后,也许就不会以格式化功能来评价IDE了。
本文将会有如下几个部分构成:什么是代码自动格式化
代码自动格式化有什么好处
如何为自己的工程加入代码自动格式化的功能
后记
参考文献
本文要求读者至少能够使用git来做项目的版本控制,以下的代码应该可以保证在windows(至少需要一个git bash或者直接安装cmder) ,linux和mac上运行。
什么是代码的自动格式化
当我们在软件开发过程中,以某种方式触发代码格式化程序对我们已经完成开发的代码进行格式修改,这个过程就是代码的自动格式化。
当使用git对你的项目进行版本控制时,我们期望在你完成代码后,做最终提交前对代码的格式进行美化,然后形成提交,最终提交到代码仓库中。
这样就可以保证代码库里的代码都是经过格式化的,会让我们的代码在review,restructure,merge的过程中更轻松。
代码自动格式化有什么好处
我从别处摘抄来的,简单翻译成中文如下:你不再需要一个代码底层样式指导手则了,因为代码自动格式化就会帮你处理这些问题。
使用代码自动格式化能减少非必要的讨论,让开发者更专注于写有用的代码。(似曾相识啊)
这样使新人能够更容易的融入项目,因为代码的格式具有延续性。
因为大家的格式都是相同的,所以能够减少代码合并(merge)冲突。
我觉得这个总结还算不错,我是懒人,当提交前忘记格式化代码,我一般都算了,使用自动代码格式化也可以减少被批评的数量。但是说到底靠人来保证一定要怎么样,这件事还是太天真了。
如何为自己的工程加入代码自动格式化的功能
终于到了本文的重点了。当使用git时,代码自动格式化的功能会通过git的hook(钩子)来实现。代码格式化将被git的pre-commit钩子调用,它会先格式化我们的代码然后再提交代码,这样一个提交中就不会存在未被格式化的代码了。
本文将会以JavaScript和Python为例说明具体实现的方式。请读者至少了解软件开发的基本工具,如nvm,node,npm,pyenv等内容。
为JavaScript项目增加代码自动格式化
下面是从create-react-app的文档中摘抄而来,并且做了一些必要的解释,它不仅可以在react项目里工作,使用了webpack的项目应该都是可行的。
第一步,安装husky,lint-staged,prettier。husky将npm的脚本集成与git的hook上,lint-staged则可以执行多个stage的任务,然后prettier将会帮助我们格式化代码。
npm install –save-dev husky lint-staged prettier
在完成安装后,我们要在package.json文件中的scripts里添加下面的代码。
“scripts”: {
+ “precommit”: “lint-staged”,
“start”: “react-scripts start”,
“build”: “react-scripts build”,
这一步为该项目下npm添加了一个新的脚本,我们可以通过npm run precommit来调用。实际上这个脚本会在代码即将提交前被调用。
第三步,在package.json中配置lint-staged。
“dependencies”: {
// …
},
+ “lint-staged”: {
+ “src/**/*.{js,jsx,json,css}”: [
+ “prettier –single-quote –write”,
+ “git add”
+ ]
+ },
“scripts”: {
我们可以看到lint-stage将会先使用prettier对即将要提交的代码格式化,然后在将这些更改加入到暂存中,然后这些暂存中的代码就被提交了。
值得一提的是,更多情况下,我们可以去定制prettier的行为,使经过它格式化的代码更加符合我们的品味。下面将给出个简单的配置方法,全部的选项请查阅prettier的文档。
接下来我们继续在package.json中配置prettier的行为。
“dependencies”: {
// …
},
+ “prettier”: {
+ “printWidth”: 120
+ },
“scripts”: {
现在我们将prettier的折行宽度设置成了120,当本行宽度超过120时,prettier才会帮我们折行,而它的默认值时80。
为Python项目增加自动代码格式化的功能
针对python我们将使用pre-commit来实现代码的自动格式化。
首先我们需要安装pre-commit
pip install pre-commit
你最好将pre-commit加入的你的requirements-dev.txt文件中以便能在开发过程中使用。
当安装完成后我们需要使用pre-commit来配置git hook。
pre-commit install
接下来就可以开始配置代码自动格式化了。
相较于JavaScript,python在代码格式化方面有更多的选择。比如autopep8,它实现了一个基于pep8的格式化工具,再比如yapf,是google开发的一个python代码格式化工具,它并不完全遵循pep8。
为了实现这些功能我们需要在项目的根目录下增加一个名为.pre-commit-config.yaml的配置文件。pre-commit将在git提交前调用该配置中的插件来完成自动格式的功能,更详细的功能请参考pre-commit的文档。
下面的例子可以让我们使用yapf来实现代码的格式化:
# .pre-commit-config.yaml
repos:
– repo: https://github.com/pre-commit/mirrors-yapf
rev: v0.23.0
hooks:
– id: yapf
repo配置该插件repo的地址,rev则是该插件repo的版本,id则是插件的id。同样我们也可以将代码格式化配置成autopep8。
# .pre-commit-config.yaml
repos:
– repo: https://github.com/pre-commit/mirrors-autopep8
rev: v1.3.5
hooks:
– id: autopep8
给hooks添加参数
repos:
– repo: https://github.com/pre-commit/mirrors-autopep8
rev: v1.3.5
hooks:
– id: autopep8
args: [–in-place, –aggressive, –aggressive ]
当我们使用git commit生成一个提交时,如果最终的代码被格式化了,那么git会提示文件被这个勾子修改了。这是因为插件帮我进行了自动格式化,我们把格式化后的代码重新提交就可以了。
针对其他语言
在使用其他语言开发时,我们一样可以使用pre-commit来实现其他语言的自动格式化,而且基本上所有的linux发行版都集成了python,使用非常方便,就请读者自行来实现了。
后记
在现代的软件开发过程中,提升效率是一个重大议题,任何细节都不应该被放过。相比很多大公司都有着完善的软件开发流程制度以及方法,小公司还处在刀耕火种阶段。单纯的人力时间累计完全是一种浪费生命的做法,在方法上提升才能实现质的突破。以前也没有正式,所以特地今天写下此文,希望能够对后来者有些帮助。
参考文献https://github.com/facebook/create-react-appgithub.comhttps://medium.com/3yourmind/auto-formatters-for-python-8925065f9505medium.com