前端代码风格自动化系列（五）之共同出击

pumpkin9 发布于2019-08-23 14:33 / 981人阅读

摘要：我们在前面的四篇中介绍了这些工具，可以完成以最小的代价在提交到远程仓库前，格式化为统一风格的代码，大家都很熟悉这里就不列举了。下面举一个配置。这里对于项目里分别做了提交前格式化操作，对于提交规范做了校验。

我们在前面的四篇中介绍了husky、commitlint、lint-staged、prettier这些工具，可以完成以最小的代价在Git提交到远程仓库前，格式化为统一风格的代码，eslint大家都很熟悉这里就不列举了。下面举一个配置。

{
  "devDependencies": {
    "babel-eslint": "^10.0.1",
    "eslint": "^5.4.0",
    "eslint-config-airbnb": "^17.0.0",
    "eslint-config-prettier": "^3.0.1",
    "eslint-plugin-babel": "^5.1.0",
    "eslint-plugin-compat": "^2.6.2",
    "eslint-plugin-import": "^2.14.0",
    "eslint-plugin-jsx-a11y": "^6.1.2",
    "eslint-plugin-markdown": "^1.0.0-beta.6",
    "eslint-plugin-react": "^7.11.1",
    "husky": "^1.1.2",
    "lint-staged": "^8.0.4",
    "prettier": "1.14.3",
    "stylelint": "^9.4.0",
    "stylelint-config-prettier": "^4.0.0",
    "stylelint-config-standard": "^18.0.0",
    "tslint": "^5.10.0",
    "tslint-config-prettier": "^1.10.0",
    "tslint-react": "^3.6.0",
  },
  "lint-staged": {
    "**/*.{js,jsx,less}": [
      "prettier --write",
      "git add"
    ],
    "**/*.{js,jsx}": "npm run lint-staged:js",
    "**/*.less": "stylelint --syntax less"
  },
  "husky": {
    "hooks": {
      "pre-commit": "npm run lint-staged",
      "commit-msg": "commitlint -e $HUSKY_GIT_PARAMS"
    }
  }
}

这里对于项目里ts、js、jsx、less分别做了提交前格式化操作，对于提交规范做了校验。

云服务器 GPU云服务器系列之系列之二架构之坑系列代码风格

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/100789.html

React 可视化开发工具 shadow-widget 最佳实践（上）

摘要：上例的功能块定义了如下节点树入口节点是面板，结合该节点的函数书写特点，我们接着介绍最佳实践如何处理功能块之内的编程。本文介绍 React + Shadow Widget 应用于通用 GUI 开发的最佳实践，只聚焦于典型场景下最优开发方法。分上、下两篇讲解，上篇概述最佳实践，介绍功能块划分。 showImg(https://segmentfault.com/img/bVWu3d?w=6...

techstay 2019-08-21 17:00 评论0 收藏0
JavaScript系列（四） - 收藏集 - 掘金

摘要：函数式编程前端掘金引言面向对象编程一直以来都是中的主导范式。函数式编程是一种强调减少对程序外部状态产生改变的方式。 JavaScript 函数式编程 - 前端 - 掘金引言面向对象编程一直以来都是JavaScript中的主导范式。JavaScript作为一门多范式编程语言，然而，近几年，函数式编程越来越多得受到开发者的青睐。函数式编程是一种强调减少对程序外部状态产生改变的方式。因此，...

cfanr 2019-08-20 16:33 评论0 收藏0
前端代码风格自动化系列（一）之Husky

摘要：代码风格和性格一样，每个程序员都有自己的特点，但对于大家协同开发的项目，还是需要力求代码风格的一致性，以减少，方便互相修改，短时间内能上手，在这条路上诞生了许许多多的工具。本系列主要介绍目前主流的前端代码格式化的工具。代码风格和性格一样，每个程序员都有自己的特点，但对于大家协同开发的项目，还是需要力求代码风格的一致性，以减少Bug，方便互相修改，短时间内能上手，在这条路上诞生了许许多...

EdwardUp 2019-08-23 14:33 评论0 收藏0
前端代码风格自动化系列（四）之Prettier

摘要：这里有个官网的例子格式化之后让我们专注于业务逻辑，无需再纠结代码风格，配合其它工具，实现了代码提交到仓库前，统一格式化。 Prettier是一个支持多语言的代码格式工具，如常用的：js、jsx、Vue、Flow、Ts、HTML、CSS等，非常全面，将代码解析为AST，然后重新组装，目的是最终输出风格统一的代码，对比eslint对error的fix要强一些，如最大长度的改动，eslint...

wangjuntytl 2019-08-23 14:33 评论0 收藏0
前端代码风格自动化系列（三）之Lint-staged

摘要：在我们介绍了之后，来看一个前端文件过滤的工具，代码的格式化肯定会涉及到文件系统，一般工具会首先读取文件，格式化操作之后，重新写入。在我们介绍了Husky、Commitlint之后，来看一个前端文件过滤的工具Lint-staged，代码的格式化肯定会涉及到文件系统，一般工具会首先读取文件，格式化操作之后，重新写入。对于较大型的项目，文件众多，首先遇到的就是性能问题，虽然如Eslint之...

zzir 2019-08-23 14:33 评论0 收藏0