前端代碼風格自動化系列（五）之共同出擊

pumpkin9 發(fā)布于2019-08-23 14:33 / 1059人閱讀

摘要：我們在前面的四篇中介紹了這些工具，可以完成以最小的代價在提交到遠程倉庫前，格式化為統(tǒng)一風格的代碼，大家都很熟悉這里就不列舉了。下面舉一個配置。這里對于項目里分別做了提交前格式化操作，對于提交規(guī)范做了校驗。

我們在前面的四篇中介紹了husky、commitlint、lint-staged、prettier這些工具，可以完成以最小的代價在Git提交到遠程倉庫前，格式化為統(tǒng)一風格的代碼，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分別做了提交前格式化操作，對于提交規(guī)范做了校驗。

GPU云服務器云服務器系列之系列之二架構之坑系列代碼風格

文章版權歸作者所有，未經(jīng)允許請勿轉載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉載請注明本文地址：http://www.ezyhdfw.cn/yun/100789.html

React 可視化開發(fā)工具 shadow-widget 最佳實踐（上）

摘要：上例的功能塊定義了如下節(jié)點樹入口節(jié)點是面板，結合該節(jié)點的函數(shù)書寫特點，我們接著介紹最佳實踐如何處理功能塊之內(nèi)的編程。本文介紹 React + Shadow Widget 應用于通用 GUI 開發(fā)的最佳實踐，只聚焦于典型場景下最優(yōu)開發(fā)方法。分上、下兩篇講解，上篇概述最佳實踐，介紹功能塊劃分。 showImg(https://segmentfault.com/img/bVWu3d?w=6...

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

摘要：函數(shù)式編程前端掘金引言面向對象編程一直以來都是中的主導范式。函數(shù)式編程是一種強調(diào)減少對程序外部狀態(tài)產(chǎn)生改變的方式。 JavaScript 函數(shù)式編程 - 前端 - 掘金引言面向對象編程一直以來都是JavaScript中的主導范式。JavaScript作為一門多范式編程語言，然而，近幾年，函數(shù)式編程越來越多得受到開發(fā)者的青睞。函數(shù)式編程是一種強調(diào)減少對程序外部狀態(tài)產(chǎn)生改變的方式。因此，...

cfanr 2019-08-20 16:33 評論0 收藏0
前端代碼風格自動化系列（一）之Husky

摘要：代碼風格和性格一樣，每個程序員都有自己的特點，但對于大家協(xié)同開發(fā)的項目，還是需要力求代碼風格的一致性，以減少，方便互相修改，短時間內(nèi)能上手，在這條路上誕生了許許多多的工具。本系列主要介紹目前主流的前端代碼格式化的工具。代碼風格和性格一樣，每個程序員都有自己的特點，但對于大家協(xié)同開發(fā)的項目，還是需要力求代碼風格的一致性，以減少Bug，方便互相修改，短時間內(nèi)能上手，在這條路上誕生了許許多...

EdwardUp 2019-08-23 14:33 評論0 收藏0
前端代碼風格自動化系列（四）之Prettier

摘要：這里有個官網(wǎng)的例子格式化之后讓我們專注于業(yè)務邏輯，無需再糾結代碼風格，配合其它工具，實現(xiàn)了代碼提交到倉庫前，統(tǒng)一格式化。 Prettier是一個支持多語言的代碼格式工具，如常用的：js、jsx、Vue、Flow、Ts、HTML、CSS等，非常全面，將代碼解析為AST，然后重新組裝，目的是最終輸出風格統(tǒng)一的代碼，對比eslint對error的fix要強一些，如最大長度的改動，eslint...

wangjuntytl 2019-08-23 14:33 評論0 收藏0
前端代碼風格自動化系列（三）之Lint-staged

摘要：在我們介紹了之后，來看一個前端文件過濾的工具，代碼的格式化肯定會涉及到文件系統(tǒng)，一般工具會首先讀取文件，格式化操作之后，重新寫入。在我們介紹了Husky、Commitlint之后，來看一個前端文件過濾的工具Lint-staged，代碼的格式化肯定會涉及到文件系統(tǒng)，一般工具會首先讀取文件，格式化操作之后，重新寫入。對于較大型的項目，文件眾多，首先遇到的就是性能問題，雖然如Eslint之...

zzir 2019-08-23 14:33 評論0 收藏0