react安装和初始化配置

  1. 使用typescript来创建react
npx create-react-app jira --template typescript

解决npx速度慢的问题
切换npm源:

npm config set registry https://registry.npm.taobao.org

切换yarn源:

yarn config set registry https://registry.npm.taobao.org
  1. 安装和配置prettier
  • 安装prettier
yarn add --dev --exact prettier
  • 创建 .prettierrc.json和.prettierjgnore文件
//.prettierjgnore文件内容
build
coverage
  • 执行命令创建commit时自动lint
npx mrm lint-staged
  • 修改lint-staged
"lint-staged": {
    "*.{ts,tsx, js,css,md}": "prettier --write"
  }
  • 创建兼容eslint和prettier的兼容
yarn add eslint-config-prettier -D
  • 使用prettier来覆盖部分eslint规则
"eslintConfig": {
    "extends": [
      "react-app",
      "react-app/jest",
      "prettier"
    ]
  }
  1. 安装commitLint来规范提交记录
yarn add -D @commitlint/config-conventional @commitlint/cli
//生成配置文件
echo "module.exports = {extends: ['@commitlint/config-conventional']};" > commitlint.config.js
//package.json文件中配置h usky
"husky": {
    "hooks": {
      "pre-commit": "lint-staged",
      "commit-msg": "commitlint -E HUSKY_GIT_PARAMS"
    }
  },

你可能感兴趣的:(react安装和初始化配置)