npm i -D eslint @typescript-eslint/parser  eslint-plugin-react
npm i -D prettier eslint-config-prettier eslint-plugin-prettier

module.exports = {
    parser:  '@typescript-eslint/parser', //定义ESLint的解析器
    // extends可省略前缀 eslint-config-
    // plugins可省略前缀 eslint-plugin-
    // extends使用插件导出的config，删掉插件前缀后加上前缀plugin:
    extends: [ // 继承的规则，后面覆盖前面
      'plugin:react/recommended', 
      'plugin:prettier/recommended',
    ],
    plugins: [
      // plugin:prettier/recommended 的 config 已包含以下plugins
      // "react",
      // '@typescript-eslint',
    ],
      parserOptions: {  // 解析器选项
      "ecmaVersion": 2019, // 支持 ES6 语法并不意味着同时支持新的 ES6 全局变量或类型（比如 Set 等新类型），需{ "env":{ "es6": true } }
      "sourceType": "module", //  "script" (默认)，如果代码是 ECMAScript 模块，设置为"module"
      "ecmaFeatures": {
        "jsx": true
      }
    },
    env:{                          // 指定代码的运行环境
        browser: true,
          es6:true,
        node: true,
    },
    // 全局变量
    globals:{
       "var1": "writable",
       "var2": "readonly",
       "var3": "off", // 禁用
    },
  settings: {             
      // eslint-plugin-react要求：https://www.npmjs.com/package/eslint-plugin-react
      "react": {
        "pragma": "React",
        "version": "detect"
      }
    }, 
    // 扩展（或覆盖）规则
    rules: {},
    // 覆盖指定文件类型的rules
    overrides: [
      {
            "files": ["./src/**/*.html"],
            "rules": {

            }
        }
    ]
}

module.exports = {
  printWidth: 120, // 行长
  tabWidth: 2, // 缩进长度
  useTabs: false, // 使用空格代替tab缩进
  semi: true, // 结尾分号
  singleQuote: true, // 单引号，jsx忽略此选项，请使用 jsxSingleQuote
  quoteProps: 'preserve', // <as-needed|consistent|preserve> 是否给对象属性加引号 preserve：保留编程时的状态
  jsxSingleQuote: false, // jsx中使用单引号
  trailingComma: 'all', // <es5|none|all> 在对象或数组最后一个元素后面是否加逗号。all 尽可能尾随逗号
  bracketSpacing: true, // 在对象前后添加空格-eg: { foo: bar }
  bracketSameLine: false, // 多属性html、jsx标签的‘>’折行放置
  arrowParens: 'avoid', // <always|avoid> avoid：单参数箭头函数参数不使用圆括号
  endOfLine: 'lf', // 结束行形式
  embeddedLanguageFormatting: 'auto', // 对引用代码进行格式化
  overrides: [
    // {
    //   files: '*.test.js',
    //   options: {
    //     semi: true,
    //   },
    // },
    // {
    //   files: ['*.html', 'legacy/**/*.js'],
    //   options: {
    //     tabWidth: 4,
    //   },
    // },
  ],
};

dist
!build/index.js

eslint --ignore-path .jshintignore file.js

eslint --ignore-path .gitignore file.js

dist
!build/index.js
node_moduls

{
  parser: "@typescript-eslint/parser",
  parserOptions: { sourceType: "module" },
  plugins: ["@typescript-eslint"],
  extends: [],
  rules: {
    "@typescript-eslint/explicit-function-return-type": [
      "error",
      {
        allowExpressions: true
      }
    ]
  }
}

{
  plugins: [],
  extends: ["plugin:@typescript-eslint/recommended"],
  rules: {
    "@typescript-eslint/explicit-function-return-type": [
      "error",
      {
        allowExpressions: true
      }
    ]
  }
}

/* eslint-disable */
alert('foo');

/* eslint-disable */
alert('foo');
/* eslint-enable */

/* eslint-disable no-alert, no-console */
alert('foo');
console.log('bar');
/* eslint-enable no-alert, no-console */

alert('foo'); // eslint-disable-line

// or

// eslint-disable-next-line
alert('foo');

alert('foo'); // eslint-disable-line no-alert

// eslint-disable-next-line no-alert
alert('foo');

alert('foo'); // eslint-disable-line no-alert, quotes, semi

// eslint-disable-next-line no-alert, quotes, semi
alert('foo');

{
	"script":{
		"lint": "eslint src --fix --ext .js,.ts,.jsx,.tsx"
	}
}

*                匹配除/之外的任意字符串
**               匹配任意字符串
?                匹配任意单个字符
[name]           匹配name中的任意一个单一字符
[!name]          匹配不存在name中的任意一个单一字符
{s1,s2,s3}       匹配给定的字符串中的任意一个(用逗号分隔) 
{num1..num2}   　匹配num1到num2之间的任意一个整数, 这里的num1和num2可以为正整数也可以为负整数

root = true                         # 根目录的配置文件，编辑器会由当前目录向上查找，如果找到 `roor = true` 的文件，则不再查找

[*]                                 # 匹配所有的文件
indent_style = space                # 空格缩进
indent_size = 4                     # 缩进空格为4个
end_of_line = lf                    # 文件换行符是 linux 的 `\n`
charset = utf-8                     # 文件编码是 utf-8
trim_trailing_whitespace = true     # 不保留行末的空格
insert_final_newline = true         # 文件末尾添加一个空行
curly_bracket_next_line = false     # 大括号不另起一行
spaces_around_operators = true      # 运算符两遍都有空格
indent_brace_style = 1tbs           # 条件语句格式是 1tbs
spaces_around_brackets              # 表示括号和括号之间应有空格：无空格，仅在括号内，仅在括号外或在括号的两侧 （none，inside，outside，both）
max_line_length                     # 在指定的字符数后强制换行。off关闭此功能
[*.js]                              # 对所有的 js 文件生效
quote_type = single                 # 字符串使用单引号

[*.{html,less,css,json}]            # 对所有 html, less, css, json 文件生效
quote_type = double                 # 字符串使用双引号

[package.json]                      # 对 package.json 生效
indent_size = 2                     # 使用2个空格缩进

# http://editorconfig.org
# root: 表明是最顶层的配置文件，发现设为true时，才会停止查找.editorconfig文件。
root = true

[*]
# 文件编码
charset = utf-8
# 使用单引号
quote_type = single
# 换行符格式
end_of_line = lf
# 缩进数量
indent_size = 2
# 缩进类型
indent_style = tab
# 行最大长度，要和.prettierrc.js保持一致
max_line_length = 120
# 删除末尾空格
trim_trailing_whitespace = true
# 结尾插入新行
insert_final_newline = true

[*.md]
trim_trailing_whitespace = false

[*.{html,css,less,scss,json}]       # 对所有 html,css,less,scss,json 文件生效
quote_type = double                 # 字符串使用双引号

# Makefile文件中要用tab缩进，这个确实是历史遗留问题，用空格缩进会出错。
[Makefile]
indent_style = tab

*.zip
!xxx.zip

!xxx.zip
*.zip

husky 或 yorkie 可以让我们向项目中方便添加git hooks。
lint-staged 是一个在git暂存文件上运行linters的工具，支持glob模式，只针对 add 的文件，不是所有文件。
Lint 这个单词的本意就是衣服上的棉球，通过 Linting 这个单词的意思就是去除代码中可能存在问题的意思。

$ ls -lah .git/hooks
applypatch-msg.sample     pre-merge-commit.sample
commit-msg.sample         pre-push.sample
fsmonitor-watchman.sample pre-rebase.sample
post-update.sample        pre-receive.sample
pre-applypatch.sample     prepare-commit-msg.sample
pre-commit.sample         update.sample

# 可通过命令行配置 core.hooksPath
$ git config 'core.hooksPath' .husky

# 也可通过写入文件配置 core.hooksPath
$ cat .git/config
[core]
  ignorecase = true
  precomposeunicode = true
  hooksPath = .husky

npm uninstall husky && git config --unset core.hooksPath

npm install lint-staged --save-dev
npx husky add .husky/pre-commit "npx lint-staged"

--ext 指定JavaScript文件扩展名-默认值：.js
--fix 自动修复问题

"scripts":{
    "lint": "eslint src --fix --ext .js,.jsx,.ts,.tsx",
},
"lint-staged": {
  "src/**":[
    "npm run lint"
  ]
}

"scripts":{
    "lint": "lint-staged",
}
"lint-staged": {
   "**/*.js": "eslint --ext .js",  
   "**/*.vue": "eslint --ext .vue",  // 可能需要安装eslint-plugin-vue
   "src/**/*.{js,vue}": [
     "prettier --write",
     "eslint  --fix",
     // "git add"  // 从v10.0.0开始，对最初暂存文件的任何新修改都将自动添加到提交中。如果您的任务以前包含git add步骤，请删除此步骤。自动行为可确保竞争条件较少，因为尝试同时运行多个git操作通常会导致错误。
   ]
},

npm install yorkie --save-dev

"scripts":{
    "lint": "eslint src --fix --ext .js,.jsx,.ts,.tsx",
},
"gitHooks": {
    "pre-commit": "lint-staged"
},
"lint-staged": {
  "src/**":[
    "npm run lint"
  ]
}

<type>(<scope>): <subject> #header部分
// 空一行
<body>
// 空一行
<footer> 

revert: feat(pencil): add 'graphiteWidth' option

This reverts commit 667ecc1654a317a13331b17617d973392f415f02.

:gitmoji: type(scope): subject(#1)

:bug: fix: Fix bug(#4)

<type>(<scope>): <subject> 

- first changes...  #body部分
- second changes... #body部分

BREAKING CHANGE: 变动的描述\理由\迁移方法

Close #ISSUE_ID
Closes #ISSUE_ID, #ISSUE_ID

npm install -D commitizen cz-customizable

// package.json
{
    "scripts":{
        "commit":"cz"
    }
}

// package.json
{
  "config": {
    "commitizen": {
      "path": "./node_modules/cz-customizable"
    },
  }
}

module.exports = {
  types: [
    { value: 'feat', name: '✨ feat:       A new feature' },
    { value: 'fix', name: '🔧 fix:        A bug fix' },
    { value: 'docs', name: '📝 docs:       Documentation only changes' },
    { value: 'style', name: '🎨 style:      Changes that do not affect the meaning of the code' },
    { value: 'refactor', name: '♻️  refactor:   A code change that neither fixes a bug nor adds a feature' },
    { value: 'perf', name: '🚀 perf:       A code change that improves performance' },
    { value: 'test', name: '🧪 test:       Adding missing or correcting existing tests' },
    { value: 'ci', name: '👷 ci:         CI configuration related e.g. changes to k8s，docker configuration files' },
    { value: 'build', name: '📦‍ build:      Changes to the build process or auxiliary tools' },
    { value: 'chore', name: '🍻 chore:      chroe' },
    { value: 'revert', name: '💊 revert:     Reverts a previous commit' }
  ],
  scopes: [
    { name: 'docs' },
    { name: 'ci' },
    { name: 'style' },
  ],

  // allowTicketNumber: false,
  // isTicketNumberRequired: false,
  // ticketNumberPrefix: 'TICKET-',
  // ticketNumberRegExp: '\\d{1,5}',

  // it needs to match the value for field type. Eg.: 'fix'
  // 当 type 为 fix 时，重写 scopes 的值
  /*  scopeOverrides: {
    fix: [
      {name: 'merge'},
      {name: 'style'},
      {name: 'e2eTest'},
      {name: 'unitTest'}
    ]
  },  */
  // override the messages, defaults are as follows
  messages: {
    type: "Select the type of change that you're committing:",
    scope: 'Denote the SCOPE of this change (optional):',
    // used if allowCustomScopes is true
    customScope: 'Denote the SCOPE of this change:',
    subject: 'Write a SHORT, IMPERATIVE tense description of the change:\n',
    body: 'Provide a LONGER description of the change (optional). Use "|" to break new line:\n',
    breaking: 'List any BREAKING CHANGES (optional):\n',
    footer: 'List any ISSUES CLOSED by this change (optional). E.g.: #31, #34:\n',
    confirmCommit: 'Are you sure you want to proceed with the commit above?',
  },
  allowCustomScopes: true,
  allowBreakingChanges: ['feat', 'fix'],
  subjectLimit: 100,
  // skip any questions you want
  // skipQuestions: ['body'],
  // limit subject length
  // breaklineChar: '|', // It is supported for fields body and footer.
  // footerPrefix : 'ISSUES CLOSED:'
  // askForBreakingChangeFirst : true, // default is false
}

// package.json
{
    "config": {
    "commitizen": {
      "path": "./node_modules/cz-emoji"
    },
    "cz-emoji": {
      "types": [
        {
          "emoji": "✨",
          "code": "✨ feat",
          "description": "A new feature",
          "name": "feature"
        },
        {
          "emoji": "🔧",
          "code": "🔧 fix",
          "description": " A bug fix",
          "name": "fix"
        },
        {
          "emoji": "📝",
          "code": "📝 docs",
          "description": "Documentation only changes",
          "name": "docs"
        },
        {
          "emoji": "🎨",
          "code": "🎨 style",
          "description": "Changes that do not affect the meaning of the code",
          "name": "style"
        },
        {
          "emoji": "♻️",
          "code": "♻️ refactor",
          "description": " A code change that neither fixes a bug nor adds a feature",
          "name": "refactor"
        },
        {
          "emoji": "🚀",
          "code": "🚀 perf",
          "description": "A code change that improves performance",
          "name": "perf"
        },
        {
          "emoji": "🧪",
          "code": "🧪 test",
          "description": "**Adding missing or correcting existing tests",
          "name": "test"
        },
        {
          "emoji": "👷",
          "code": "👷 ci",
          "description": "CI configuration related e.g. changes to k8s，docker configuration files",
          "name": "ci"
        },
        {
          "emoji": "📦‍",
          "code": "📦‍ build",
          "description": "Changes to the build process or auxiliary tools",
          "name": "build"
        },
        {
          "emoji": "🍻",
          "code": "🍻 chore",
          "description": "chore",
          "name": "chore"
        },
        {
          "emoji": "💊",
          "code": "💊 revert",
          "description": "Reverts a previous commit",
          "name": "revert"
        }
      ],
      "scopes": [
        "docs",
        "ci",
        "style"
      ],
      "subjectMaxLength": 50
    }
  }
}

npm i -D @commitlint/cli @commitlint/config-conventional

module.exports = {
  extends: ['@commitlint/config-conventional'],
  /*
   * Any rules defined here will override rules from extends-config
   */
  // 0 disables the rule. For 1 it will be considered a warning for 2 an error.
  // always|never: never inverts(取反) the rule.
  rules: { // 要和 .cz-config.js 的 type 保持完全一致
    "type-enum": [2, 'always', ['feat', 'fix', 'docs', 'style', 'refactor', 'perf', 'test', 'ci', 'build', 'chore', 'revert']]
  },
}

npm i -D @commitlint/cli commitlint-config-git-commit-emoji

module.exports = {
  extends: ['git-commit-emoji'], // commitlint-config-git-commit-emoji 可省略前缀 commitlint-config-
  /*
   * Any rules defined here will override rules from extends-config
   */
  rules: { // 要和 .cz-config.js 的 type 保持完全一致
    "type-enum": [2, 'always', ['✨ feat', '🔧 fix', '📝 docs', '🎨 style', '♻️  refactor', '🚀 perf', '🧪 test', '👷 ci', '📦‍ build', '🍻 chore', '⏪️ revert']]
  },
}

# Add hook
npx husky add .husky/commit-msg 'npx --no -- commitlint --edit "$1"'
# Sometimes above command doesn't work in some command interpreters
# You can try other commands below to write npx --no -- commitlint --edit $1
# in the commit-msg file.
npx husky add .husky/commit-msg \"npx --no -- commitlint --edit '$1'\"
# or
npx husky add .husky/commit-msg "npx --no -- commitlint --edit $1"

# or
yarn husky add .husky/commit-msg 'yarn commitlint --edit $1'

npm i -D semantic-release @semantic-release/changelog @semantic-release/git conventional-changelog-conventionalcommits

// semantic-release 配置
module.exports = {
  branches: [ // 指定在哪个分支下要执行发布操作
    'master',
    {
      name: 'beta', prerelease: true // beta 分支为 预发布 分支 2.0.0-beta.1, 2.0.0-beta.2, etc...
    }
  ],
  plugins: [ // 插件有顺序要求
    [
      '@semantic-release/commit-analyzer', // semantic-release plugin to analyze commits with conventional-changelog
      {
        preset: "conventionalcommits", // 需安装 conventional-changelog-conventionalcommits
        // 没列在这里或者不在 default release rules(https://github.com/semantic-release/commit-analyzer/blob/master/lib/default-release-rules.js) 里的规则，不会进行 release
        "releaseRules": [
          { type: 'feat', release: 'minor' },
          { type: 'fix', release: 'patch' },
          { type: 'perf', release: 'patch' },
          { type: 'style', release: 'patch' },
          { type: 'revert', release: 'patch' },
          { breaking: true, release: 'major' }, // https://www.conventionalcommits.org/en a commit that has a footer BREAKING  CHANGE: 
        ],
        "parserOpts": {
          "noteKeywords": ["BREAKING CHANGE", "BREAKING CHANGES"] // the commits that contains BREAKING CHANGE, BREAKING CHANGES or BREAKING in their body will be considered breaking changes(by default the angular preset checks only for BREAKING CHANGE and BREAKING CHANGES)
        }
      }
    ],
    ['@semantic-release/release-notes-generator', // semantic-release plugin to generate changelog content(非文件) with conventional-changelog
      {
        preset: "conventionalcommits",
        presetConfig: { // Conventional Changelog Configuration Spec, https://github.com/conventional-changelog/conventional-changelog-config-spec
          "types": [
            { "type": "feat", "section": "✨ Features | 新功能" },
            { "type": "fix", "section": "🛠️ Bug Fixes | Bug 修复" },
            { "type": "docs", "section": "📝 Documentation | 文档" },
            { "type": "style", "section": "🎨 Styles | 风格" },
            { "type": "refactor", "section": "♻️ Code Refactoring | 代码重构" },
            { "type": "perf", "section": "🚀 Performance Improvements | 性能优化" },
            { "type": "test", "section": "📸 Tests | 测试" },
            { "type": "build", "section": "📦‍ Build System | 打包构建" },
            { "type": "ci", "section": "🐳 Continuous Integration | CI 配置" },
            { "type": "chore", "section": "🍮 Chore | 构建/工程依赖/工具" },
            { "type": "revert", "section": "💊 Revert | 回退" }
          ]
        }
      }
    ],
    [
      '@semantic-release/changelog', // semantic-release plugin to create or update a changelog file
      {
        changelogFile: 'CHANGELOG.md'
      }
    ],
    // 需要NPM_TOKEN，命令行cross-env、或 .npmrc 文件 或在 github actions中定义
    // 根据commit type，Update the package.json version
    '@semantic-release/npm',  // semantic-release plugin to publish a npm package.
    // 需要GITHUB_TOKEN
    [
      '@semantic-release/github', // 创建 github-release
      {
        labels: false // The labels to add to the issue created when a release fails. Set to false to not add any label.
      }
    ],
    [
      '@semantic-release/git', // semantic-release plugin to commit release assets to the project's git repository.
      {
        assets: ['CHANGELOG.md', 'package.json'], // release成功后，远程仓库的CHANGELOG.md、package.json 会更新，本地仓库需要 git pull 拉取
        message: "🍺 chore(release): ${nextRelease.version} [skip ci]\n\n${nextRelease.notes}"
      }
    ]
  ]
}

// conventional-changelog-emoji-config 配置
module.exports = {
  displayTypes: ['build', 'ci', 'feat', 'fix', 'docs', 'style', 'refactor', 'perf', 'test', 'chore', 'revert',]
}

npm i -D standard-version conventional-changelog-emoji-config

{
  "scripts": {
     "release": "standard-version",
     "release-major": "standard-version --release-as major",
     "release-minor": "standard-version --release-as minor",
     "release-patch": "standard-version --release-as patch"
  }
}

npm run release

module.exports = {
  "types": [
    { "type": "feat", "section": "✨ Features | 新功能" },
    { "type": "fix", "section": "🔧 Bug Fixes | Bug 修复" },
    { "type": "docs", "section": "📝 Documentation | 文档" },
    { "type": "style", "section": "🎨 Styles | 风格" },
    { "type": "refactor", "section": "♻️ Code Refactoring | 代码重构" },
    { "type": "perf", "section": "🚀 Performance Improvements | 性能优化" },
    { "type": "test", "section": "📸 Tests | 测试" },
    { "type": "build", "section": "📦‍ Build System | 打包构建" },
    { "type": "ci", "section": "🐳 Continuous Integration | CI 配置" },
    { "type": "chore", "section": "🍮 Chore | 构建/工程依赖/工具" }, 
    { "type": "revert", "section": "💊 Revert | 回退" }
  ]
}

"types": [
    {"type": "feat", "section": "Features"},
    {"type": "fix", "section": "Bug Fixes"},
    {"type": "chore", "hidden": true},
    {"type": "docs", "hidden": true},
    {"type": "style", "hidden": true},
    {"type": "refactor", "hidden": true},
    {"type": "perf", "hidden": true},
    {"type": "test", "hidden": true}
]

npm i -D conventional-changelog-emoji-config
npx husky add .husky/pre-push "npm run release"

{
  "scripts": {
    "release": "standard-version --preset emoji-config",
    "release-major": "standard-version --preset emoji-config --release-as major",
    "release-minor": "standard-version --preset emoji-config --release-as minor",
    "release-patch": "standard-version --preset emoji-config --release-as patch"
  }
}

module.exports = {
  // changlog 可以显示的type
  displayTypes: ['build', 'ci', 'feat', 'fix', 'docs', 'style', 'refactor', 'perf', 'test', 'chore', 'revert',]
}

$ npm audit
┌───────────────┬──────────────────────────────────────────────────────────────┐
│ high          │ Regular Expression Denial of Service in trim                 │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Package       │ trim                                                         │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Patched in    │ >=0.0.3                                                      │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Dependency of │ @mdx-js/loader                                               │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Path          │ @mdx-js/loader > @mdx-js/mdx > remark-mdx > remark-parse >   │
│               │ trim                                                         │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ More info     │ https://www.npmjs.com/advisories/1002775                     │
└───────────────┴──────────────────────────────────────────────────────────────┘
76 vulnerabilities found - Packages audited: 1076
Severity: 49 Moderate | 27 High
✨  Done in 4.60s.

$ npm audit production

$ yarn audit dependencies

$ npm audit fix

$ npx snyk

$ npx wizard

# Basic dependabot.yml file with
# minimum configuration for two package managers

version: 2
updates:
  # Enable version updates for npm
  - package-ecosystem: "npm"
    # Look for `package.json` and `lock` files in the `root` directory
    directory: "/"
    # Check the npm registry for updates every day (weekdays)
    schedule:
      interval: "daily"

  # Enable version updates for Docker
  - package-ecosystem: "docker"
    # Look for a `Dockerfile` in the `root` directory
    directory: "/"
    # Check for updates once a week
    schedule:
      interval: "weekly"

$ npx npm-check-updates --target patch

$ npm i -D patch-package
# 在 package.json scripts 增加命令 "postinstall":"patch-package"

# 修改 lodash 的一个小问题
$ vim node_modules/lodash/index.js

# 对 lodash 的修复，生成一个 patch 文件，位于 {workRoot}/patches/lodash+4.17.21.patch
$ npx patch-package lodash

# 将修复文件提交到版本管理之中
$ git add patches/lodash+4.17.21.patch
$ git commit -m "fix 一点儿小事 in lodash"

# 当其他同事拉到代码如何应用补丁呢？让同事执行 npm i

# 此后的命令在生产环境或 CI 中执行
# 此后的命令在生产环境或 CI 中执行
# 此后的命令在生产环境或 CI 中执行

# 在生产环境装包
$ npm i

# 大功告成！