You need some VistualStudio Code extensions installed:
- ESLint
- Prettier
Also, commitizen
is used to standarize commit messages.
After initial install, you must install the dev dependencies. You can run yarn:init
or add dev dependencies manually:
eslint-plugin-react@^7.14.3 eslint-config-airbnb@latest eslint@^6.1.0 eslint-plugin-import@^2.18.2 eslint-plugin-jsx-a11y@^6.2.3 eslint-plugin-react-hooks@^1.7. prettier eslint-config-prettier eslint-plugin-prettier babel-eslint eslint-import-resolver-babel-plugin-root-import babel-plugin-root-import customize-cra react-app-rewired node-sass commitizen cz-conventional-changelog husky lint-staged @commitlint/cli @commitlint/config-conventiona
Aside from normally installed scripts, there are 2 more:
Creates test coverage report in __tests__/coverage
Peforms a eslint --fix
in staged files
Installs dev dependencies
This template comes with Husky hooks, commitzen and commitlint to produce standard commit messages!
In case the is an error with your package.json
configuration, a copy of the custom variables is next:
{
"husky": {
"hooks": {
"pre-commit": "yarn lint",
"prepare-commit-msg": "exec < /dev/tty && git cz --hook || true",
"commit-msg": "commitlint -E HUSKY_GIT_PARAMS"
}
},
"lint-staged": {
"*.js": ["eslint --fix", "git add"]
},
"jest": {
"roots": ["<rootDir>/__tests__/"],
"testMatch": ["**/*.test.js"],
"moduleNameMapper": {
"^~/(.*)": "<rootDir>/src/$1",
"\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$": "<rootDir>/__tests__/__mocks__/fileMock.js",
"\\.(css|less)$": "<rootDir>/__tests__/__mocks__/styleMock.js"
},
"coverageDirectory": "__tests__/coverage"
},
"config": {
"commitizen": {
"path": "./node_modules/cz-conventional-changelog"
}
}
}