Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

https://github.com/alibaba/f2e-spec

Alibaba Front-end Coding Guidelines and Relevant Tools
https://github.com/alibaba/f2e-spec

guidelines linter specification

Last synced: 9 days ago
JSON representation

Alibaba Front-end Coding Guidelines and Relevant Tools

Lists

README

        

# 阿里巴巴前端规约

## 简介

「阿里巴巴前端规约」是在阿里经济体内广泛使用的一套前端编码和工程规范,致力于通过统一编码风格、普及最佳实践和代码缺陷检查帮助团队降低协作成本、提升前端项目的可维护性和稳定性。

本项目主要包括「规约文档」和「配套工具」两部分。你可以通过阅读规约文档了解各前端语言、框架及工程规范,并使用 [F2ELint](https://www.npmjs.com/package/f2elint) 等配套工具来为项目接入规约检查。

## 规约文档

规约文档分为编码规约和工程规约两大类,包括:

- 编码规约
- [JavaScript 编码规约](docs/coding/javascript.md)
- [TypeScript 编码规约](docs/coding/typescript.md)
- [React 编码规约](docs/coding/react.md)
- [Node.js 开发规约](docs/coding/node.md)
- [CSS 编码规约](docs/coding/css.md)
- [HTML 编码规约](docs/coding/html.md)
- 工程规约
- [Git 规约](docs/engineering/git.md)
- [文档通用规约](docs/engineering/writing.md)
- [更新日志规约](docs/engineering/changelog.md)

## 规约工具

我们引入了多个业界流行的 Linter 作为规约文档的配套工具,并根据规约内容定制了对应的规则包,它们包括:

| 规约 | 工具 | 规则 |
| ------------------- | -------------- | ------------------------- |
| JavaScript 编码规约 | [ESLint] | [eslint-config-ali] |
| TypeScript 编码规约 | [ESLint] | [eslint-config-ali] |
| React 编码规约 | [ESLint] | [eslint-config-ali] |
| Node.js 开发规约 | [ESLint] | [eslint-config-ali] |
| CSS 编码规约 | [stylelint] | [stylelint-config-ali] |
| Git 规约 | [commitlint] | [commitlint-config-ali] |
| 文档通用规约 | [markdownlint] | [markdownlint-config-ali] |

可以看到这些 Linter 和规则包众多且零散,全部安装它们会给项目增加十几个依赖,接入及后续升级成本都比较高。

因此我们封装了 [F2ELint](https://www.npmjs.com/package/f2elint) 这个 npm 包,它收敛屏蔽了这些依赖和配置细节,提供简单的 CLI 和 Node.js API,让项目能够一键接入、一键扫描、一键修复、一键升级,并为项目配置 git commit 卡口,降低项目接入规约的成本。

你可以使用 [F2ELint](https://www.npmjs.com/package/f2elint) 方便地为项目接入全套规约 Lint,也可以根据需求单独安装 xx-config-ali 和相关 Linter。

## 如何参与

非常欢迎大家通过 [Issues](https://github.com/alibaba/f2e-spec/issues) 反馈问题和需求,或者通过 [PRs](https://github.com/alibaba/f2e-spec/pulls) 参与贡献,请参考 [CONTRIBUTING.md](/CONTRIBUTING.md)。

## 贡献署名

文档撰写人员(排名不分先后):邦彦、尘弦、迟帆、大果、氐宿、法海、姬无、倞羽、连木、林熠、零弌、墨止、牧曈、霂之、年翼、清锐、萨波、释然、双龙、苏青、阎罗、扬炀、洋风、云谦、载天、梓骞

文档审阅人员(排名不分先后):大貘、九十、狼叔、龙归、秦粤、上坡、死月、苏千、吞吞、潕量、艺璇、游鹿、裕波、张挺、知忧

工具编写人员(排名不分先后):尘弦、鹤仙、连木、牧曈、年翼、秦粤、萨波、双龙、扬炀、洋风

[其他贡献者参见此处](https://github.com/alibaba/f2e-spec/graphs/contributors)

## 引用信息及鸣谢

本项目的文档部分参考或引用了许多优秀的业界开源规范、标准化文档和技术官网,它们主要包括:

- [Airbnb Style Guide](https://github.com/airbnb/javascript)
- [Google Style Guide](https://google.github.io/styleguide)
- [Code Guide by @mdo](http://codeguide.co)
- [ecomfe/spec](https://github.com/ecomfe/spec)
- [Conventional Commits](https://www.conventionalcommits.org)
- [Conventional Changelog](https://github.com/conventional-changelog/conventional-changelog/blob/master/packages/conventional-changelog/CHANGELOG.md)
- [MDN Web 开发者文档](https://developer.mozilla.org/zh-CN/docs/Web)
- [React 官方文档](https://reactjs.org/docs/)
- [谷歌 Web 开发者文档](https://developers.google.com/web)

更详细的引用说明请参见各规约文档的「参考资料」章节。

本项目的配套工具使用了多个优秀的 Linter、Formatter 及社区生态,主要包括:

- [ESLint](https://eslint.org) 及[多个 plugin 和 parser](https://github.com/alibaba/f2e-spec/tree/main/packages/eslint-config-ali#eslint-config-ali)
- [stylelint] 及 [stylelint-scss](https://github.com/kristerkari/stylelint-scss)
- [commitlint] 及 [conventional-changelog-conventionalcommits](https://github.com/conventional-changelog/conventional-changelog/tree/master/packages/conventional-changelog-conventionalcommits)
- [markdownlint](https://github.com/DavidAnson/markdownlint)

在此表示感谢,如有侵权行为,敬请联系我们 :-)

[ESLint]: https://eslint.org/
[eslint-config-ali]: https://www.npmjs.com/package/eslint-config-ali
[stylelint]: https://stylelint.io/
[stylelint-config-ali]: https://www.npmjs.com/package/stylelint-config-ali
[commitlint]: https://commitlint.js.org/
[commitlint-config-ali]: https://www.npmjs.com/package/commitlint-config-ali
[markdownlint]: https://github.com/DavidAnson/markdownlint
[markdownlint-config-ali]: https://www.npmjs.com/package/markdownlint-config-ali