rainbow-codelint v0.0.0-1

安装

$ npm i --save-dev rainbow-codelint eslint stylelint prettier @commitlint/cli

PS: 你不需要再去安装其他的eslint plugins和parsers.\

• 推荐安装vscode插件，prettier和stylelint，这样可以在编写代码时就自动进行格式化。否则则需要手动执行格式化命令
• 可以选择性安装eslint stylelint prettier @commitlint/cli，需要哪个安装哪个

用法

1. 创建对应的配置文件

• 想要eslint检验就创建.eslintrc.js
• 想要css、less、scss检验就创建.stylelintrc.js
• 想要代码格式化检验就创建.prettierrc.js
• 想要git commit检验就创建.commitlintrc.js

2. 修改配置文件

/**
 * 支持react\vue\或者普通js项目
 */
// .eslintrc.js
const { getESLintConfig } = require('rainbow-codelint');
// getESLintConfig(rule: 'common'|'react'|'vue' , customConfig?);
module.exports = getESLintConfig('common');
// .stylelintrc.js
const { getStylelintConfig } = require('rainbow-codelint');
// getStylelintConfig(rule: 'common'|'react'|'vue' , customConfig?);
module.exports = getStylelintConfig('common');
// .prettierrc.js
const { getPrettierConfig } = require('rainbow-codelint');
// getPrettierConfig(rule: 'common'|'react'|'vue' , customConfig?);
module.exports = getPrettierConfig('common');
// .commitlintrc.js
const { getCommitlintConfig } = require('rainbow-codelint');
// getCommitlintConfig(rule: 'common'|'react'|'vue' , customConfig?);
module.exports = getCommitlintConfig('common');

FAQ

自定义配置

// .eslintrc.js
const { getESLintConfig } = require('rainbow-codelint');

// getESLintConfig(rule: 'common'|'react'|'vue', customConfig?);
module.exports = getESLintConfig('common', {
  // custom config it will merge into main config
  rules: {
    // ...
  },
});

package.json 脚本

添加 scripts 到你的 package.json, 例如:

"scripts": {
  "lint": "npm run eslint && npm run stylelint",
  "eslint": "eslint --cache --ext .js,.jsx,.ts,.tsx ./",
  "stylelint": "stylelint ./**/*.{css,less,scss}",
  "prettier": "prettier **/* --write"
}

利用git的钩子函数进行暂存区校验

要在创建提交之前进行lint校验，可以使用husky的git钩子。

为你的项目安装huskynpm install husky --save-dev 或者 yarn add -D husky.

最后，推荐去看下 husky 文档, 如何创建"commit-msg" 和 "pre-commit" 脚本.