Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/pcattori/react-toolkit
Personal toolkit for React apps
https://github.com/pcattori/react-toolkit
babel eslint prettier react toolkit typescript webpack
Last synced: about 7 hours ago
JSON representation
Personal toolkit for React apps
- Host: GitHub
- URL: https://github.com/pcattori/react-toolkit
- Owner: pcattori
- License: mit
- Created: 2021-02-28T03:17:39.000Z (over 3 years ago)
- Default Branch: main
- Last Pushed: 2021-02-28T16:16:49.000Z (over 3 years ago)
- Last Synced: 2024-10-06T07:48:22.933Z (about 1 month ago)
- Topics: babel, eslint, prettier, react, toolkit, typescript, webpack
- Language: JavaScript
- Homepage:
- Size: 146 KB
- Stars: 0
- Watchers: 3
- Forks: 0
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# @pcattori/react-toolkit
Personal toolkit for React apps.
Toolkit includes:
- [prettier](https://prettier.io/)
- [eslint](https://eslint.org/)
- [typescript](https://www.typescriptlang.org/)
- [babel](https://babeljs.io/)
- [webpack](https://webpack.js.org/)
...along with default configuration, extensions, and plugins for each.
---
For more on toolkits, see:
- [The Melting Pot of Javascript](https://youtu.be/G39lKaONAlA) - Dan Abramov
- [Concerning Toolkits](https://kentcdodds.com/blog/concerning-toolkits) - Kent C. Dodds
## Install
Install `@pcattori/react-toolkit` as a dev dependency:
```sh
npm install -D @pcattori/react-toolkit
```
### prettier
`.prettierrc.js`:
```js
var defaults = require('@pcattori/react-toolkit').prettier()
module.exports = {
...defaults,
// overrides go here
}
```
### eslint
`.eslintrc.js`:
```js
var defaults = require('@pcattori/react-toolkit').eslint()
module.exports = {
...defaults,
// overrides go here
}
```
### typescript
`tsconfig.json`:
```json
{
"extends": "./node_modules/@pcattori/react-toolkit/src/tsconfig.json",
"include": ["./src/**/*"]
}
```
### babel
`.babelrc.js`:
```js
var defaults = require('@pcattori/react-toolkit').babel()
module.exports = {
...defaults,
// overrides go here
}
```
For more, including how to provide overrides, see the [tsconfig documentation](https://www.typescriptlang.org/tsconfig#extends).
### webpack
`webpack.config.js`:
```js
var defaults = require('@pcattori/react-toolkit').webpack()
module.exports = {
...defaults,
// overrides go here
}
```
## NPM scripts
Add any of the following to your `package.json`:
```json
{
"scripts": {
"format": "prettier --check .",
"format:fix": "prettier --write .",
"lint": "eslint .",
"lint:fix": "eslint --fix .",
"typecheck": "tsc --noEmit",
"build": "webpack --mode='production'",
"start:dev": "webpack serve --mode='development' --host 0.0.0.0"
}
}
```