├── .gitignore ├── .eslintignore ├── .prettierignore ├── .prettierrc ├── husky.config.js ├── typings └── png.d.ts ├── cypress.json ├── cypress ├── integration │ └── example.spec.ts ├── videos │ └── example.spec.ts.mp4 ├── tsconfig.json ├── plugins │ └── index.js ├── fixtures │ └── example.json └── support │ ├── index.ts │ └── commands.ts ├── lint-staged.config.js ├── storybook ├── preview.js ├── main.js └── stories │ ├── example2.stories.tsx │ └── example.stories.mdx ├── __tests__ └── example.spec.ts ├── .editorconfig ├── src ├── index.tsx └── App.tsx ├── .babelrc.js ├── public └── index.html ├── tsconfig.json ├── webpack.config.prod.js ├── webpack.config.dev.js ├── package.json ├── README.md ├── .eslintrc └── jest.config.js /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | -------------------------------------------------------------------------------- /.eslintignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | build 3 | cypress/videos 4 | cypress/screenshots 5 | -------------------------------------------------------------------------------- /.prettierignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | build 3 | cypress/videos 4 | cypress/screenshots 5 | -------------------------------------------------------------------------------- /.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "singleQuote": true, 3 | "semi": false, 4 | "trailingComma": "none" 5 | } 6 | -------------------------------------------------------------------------------- /husky.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | hooks: { 3 | 'pre-commit': 'lint-staged' 4 | } 5 | } 6 | -------------------------------------------------------------------------------- /typings/png.d.ts: -------------------------------------------------------------------------------- 1 | declare module '*.png' { 2 | const content: string 3 | 4 | export default content 5 | } 6 | -------------------------------------------------------------------------------- /cypress.json: -------------------------------------------------------------------------------- 1 | { 2 | "baseUrl": "http://localhost:3000", 3 | "viewportWidth": 1366, 4 | "viewportHeight": 768 5 | } 6 | -------------------------------------------------------------------------------- /cypress/integration/example.spec.ts: -------------------------------------------------------------------------------- 1 | describe('testing example', () => { 2 | it('visit url', () => { 3 | cy.visit('/') 4 | }) 5 | }) 6 | -------------------------------------------------------------------------------- /cypress/videos/example.spec.ts.mp4: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dannielss/react-typescript-boilerplate/HEAD/cypress/videos/example.spec.ts.mp4 -------------------------------------------------------------------------------- /lint-staged.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | '**/*.+(js|jsx|json|ts|tsx|md|mdx|html|eslintrc|prettierrc)': [ 3 | 'prettier --write' 4 | ] 5 | } 6 | -------------------------------------------------------------------------------- /storybook/preview.js: -------------------------------------------------------------------------------- 1 | export const parameters = { 2 | controls: { expanded: true }, 3 | viewport: { 4 | defaultViewport: 'responsive' 5 | } 6 | } 7 | -------------------------------------------------------------------------------- /__tests__/example.spec.ts: -------------------------------------------------------------------------------- 1 | describe('testing', () => { 2 | it('example of test', () => { 3 | const a = 1 4 | expect(a + 1).toEqual(2) 5 | }) 6 | }) 7 | -------------------------------------------------------------------------------- /cypress/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "types": ["cypress"] 5 | }, 6 | "include": [".", "../typings"] 7 | } 8 | -------------------------------------------------------------------------------- /.editorconfig: -------------------------------------------------------------------------------- 1 | root = true 2 | 3 | [*] 4 | indent_style = space 5 | indent_size = 2 6 | charset = utf-8 7 | trim_trailing_whitespace = true 8 | insert_final_newline = true 9 | -------------------------------------------------------------------------------- /cypress/plugins/index.js: -------------------------------------------------------------------------------- 1 | module.exports = (on, config) => { 2 | // `on` is used to hook into various events Cypress emits 3 | // `config` is the resolved Cypress config 4 | } 5 | -------------------------------------------------------------------------------- /src/index.tsx: -------------------------------------------------------------------------------- 1 | import * as React from 'react' 2 | import * as ReactDOM from 'react-dom' 3 | import App from './App' 4 | 5 | ReactDOM.render(, document.getElementById('root')) 6 | -------------------------------------------------------------------------------- /cypress/fixtures/example.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "Using fixtures to represent data", 3 | "email": "hello@cypress.io", 4 | "body": "Fixtures are a great way to mock data for responses to routes" 5 | } 6 | -------------------------------------------------------------------------------- /storybook/main.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | stories: ['./stories/*.stories.@(tsx|mdx)'], 3 | addons: [ 4 | '@storybook/addon-docs', 5 | '@storybook/addon-controls', 6 | '@storybook/addon-viewport' 7 | ] 8 | } 9 | -------------------------------------------------------------------------------- /.babelrc.js: -------------------------------------------------------------------------------- 1 | const plugins = [ 2 | 'react-hot-loader/babel', 3 | '@babel/plugin-proposal-class-properties' 4 | ] 5 | 6 | module.exports = { 7 | presets: [ 8 | '@babel/preset-env', 9 | '@babel/preset-react', 10 | '@babel/preset-typescript' 11 | ], 12 | plugins 13 | } 14 | -------------------------------------------------------------------------------- /public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | React-Webpack 7 | 8 | 9 |
10 | 11 | 12 | -------------------------------------------------------------------------------- /src/App.tsx: -------------------------------------------------------------------------------- 1 | import React, { useState } from 'react' 2 | import { hot } from 'react-hot-loader/root' 3 | 4 | interface IProps { 5 | name: string 6 | color: string 7 | } 8 | 9 | const App: React.FC = ({ name, color }) => { 10 | return

{name}

11 | } 12 | 13 | export default hot(App) 14 | -------------------------------------------------------------------------------- /tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "jsx": "react", 4 | "module": "commonjs", 5 | "noImplicitAny": true, 6 | "preserveConstEnums": true, 7 | "removeComments": true, 8 | "target": "es5", 9 | "esModuleInterop": true 10 | }, 11 | "include": [ 12 | "src", 13 | "typings", 14 | "__tests__", 15 | "storybook/stories", 16 | "storybook/preview.js" 17 | ] 18 | } 19 | -------------------------------------------------------------------------------- /cypress/support/index.ts: -------------------------------------------------------------------------------- 1 | // *********************************************************** 2 | // This example support/index.js is processed and 3 | // loaded automatically before your test files. 4 | // 5 | // This is a great place to put global configuration and 6 | // behavior that modifies Cypress. 7 | // 8 | // You can change the location of this file or turn off 9 | // automatically serving support files with the 10 | // 'supportFile' configuration option. 11 | // 12 | // You can read more here: 13 | // https://on.cypress.io/configuration 14 | // *********************************************************** 15 | 16 | // Import commands.js using ES2015 syntax: 17 | import './commands' 18 | 19 | // Alternatively you can use CommonJS syntax: 20 | // require('./commands') 21 | -------------------------------------------------------------------------------- /storybook/stories/example2.stories.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import App from '../../src/App' 3 | 4 | export default { 5 | title: 'MDX/App', 6 | component: App, 7 | argTypes: { 8 | name: { 9 | control: 'text', 10 | description: 'Text of h1', 11 | table: { 12 | defaultValue: { summary: '-' } 13 | } 14 | }, 15 | color: { 16 | control: 'color', 17 | description: 'Color of h1', 18 | table: { 19 | defaultValue: { summary: '-' } 20 | } 21 | } 22 | }, 23 | parameters: { layout: 'centered' } 24 | } 25 | 26 | const MyApp = (args: { name: string; color: string }) => 27 | 28 | export const teste = MyApp.bind({}) 29 | 30 | teste.args = { name: 'DANIELS', color: 'black' } 31 | teste.parameters = { 32 | docs: { 33 | source: { 34 | code: `` 35 | } 36 | } 37 | } 38 | -------------------------------------------------------------------------------- /webpack.config.prod.js: -------------------------------------------------------------------------------- 1 | const path = require('path') 2 | const HtmlWebpackPlugin = require('html-webpack-plugin') 3 | 4 | module.exports = { 5 | entry: path.resolve(__dirname, 'src/index.tsx'), 6 | mode: 'production', 7 | output: { 8 | path: path.resolve(__dirname, 'build'), 9 | filename: 'bundle.js' 10 | }, 11 | resolve: { 12 | extensions: ['.js', '.jsx', '.json', '.ts', '.tsx', '.mdx'] 13 | }, 14 | module: { 15 | rules: [ 16 | { 17 | test: /\.jsx?$|.tsx?$/, 18 | exclude: /node_modules/, 19 | loader: 'babel-loader?cacheDirectory' 20 | }, 21 | { 22 | test: /\.css$/, 23 | loader: 'css-loader' 24 | }, 25 | { 26 | test: /\.(png|jpe?g|gif)$/i, 27 | loader: 'file-loader' 28 | } 29 | ] 30 | }, 31 | plugins: [ 32 | new HtmlWebpackPlugin({ 33 | template: path.resolve(__dirname, 'public', 'index.html') 34 | }) 35 | ] 36 | } 37 | -------------------------------------------------------------------------------- /cypress/support/commands.ts: -------------------------------------------------------------------------------- 1 | // *********************************************** 2 | // This example commands.js shows you how to 3 | // create various custom commands and overwrite 4 | // existing commands. 5 | // 6 | // For more comprehensive examples of custom 7 | // commands please read more here: 8 | // https://on.cypress.io/custom-commands 9 | // *********************************************** 10 | // 11 | // 12 | // -- This is a parent command -- 13 | // Cypress.Commands.add("login", (email, password) => { ... }) 14 | // 15 | // 16 | // -- This is a child command -- 17 | // Cypress.Commands.add("drag", { prevSubject: 'element'}, (subject, options) => { ... }) 18 | // 19 | // 20 | // -- This is a dual command -- 21 | // Cypress.Commands.add("dismiss", { prevSubject: 'optional'}, (subject, options) => { ... }) 22 | // 23 | // 24 | // -- This will overwrite an existing command -- 25 | // Cypress.Commands.overwrite("visit", (originalFn, url, options) => { ... }) 26 | -------------------------------------------------------------------------------- /storybook/stories/example.stories.mdx: -------------------------------------------------------------------------------- 1 | import { 2 | Meta, 3 | Canvas, 4 | Story, 5 | ArgsTable, 6 | Source, 7 | Preview 8 | } from '@storybook/addon-docs/blocks' 9 | import App from '../../src/App' 10 | 11 | 32 | 33 | export const Template = (args) => 34 | 35 | # App 36 | 37 | '}> 38 | 45 | {Template.bind({})} 46 | 47 | 48 | 49 | 50 | -------------------------------------------------------------------------------- /webpack.config.dev.js: -------------------------------------------------------------------------------- 1 | const path = require('path') 2 | const HtmlWebpackPlugin = require('html-webpack-plugin') 3 | 4 | module.exports = { 5 | entry: path.resolve(__dirname, 'src/index.tsx'), 6 | mode: 'development', 7 | output: { 8 | path: path.resolve(__dirname, 'build'), 9 | filename: 'bundle.js' 10 | }, 11 | devtool: 'source-map', 12 | devServer: { 13 | historyApiFallback: true, 14 | contentBase: path.resolve(__dirname, 'build'), 15 | port: 3000, 16 | open: true, 17 | hot: true, 18 | overlay: true 19 | }, 20 | resolve: { 21 | extensions: ['.js', '.jsx', '.json', '.ts', '.tsx', '.mdx'], 22 | alias: { 23 | 'react-dom': '@hot-loader/react-dom' 24 | } 25 | }, 26 | module: { 27 | rules: [ 28 | { 29 | test: /\.jsx?$|.tsx?$/, 30 | exclude: /node_modules/, 31 | loader: 'babel-loader?cacheDirectory' 32 | }, 33 | { 34 | test: /\.css$/, 35 | loader: 'css-loader' 36 | }, 37 | { 38 | test: /\.(png|jpe?g|gif)$/i, 39 | loader: 'file-loader' 40 | } 41 | ] 42 | }, 43 | plugins: [ 44 | new HtmlWebpackPlugin({ 45 | template: path.resolve(__dirname, 'public', 'index.html') 46 | }) 47 | ] 48 | } 49 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "react-typescript-boilerplate", 3 | "version": "1.0.0", 4 | "description": "", 5 | "main": "index.js", 6 | "scripts": { 7 | "dev": "webpack-dev-server --config webpack.config.dev.js", 8 | "start": "serve -n -s -l 3000 build", 9 | "build": "webpack --config webpack.config.prod.js", 10 | "test:e2e": "npm-run-all -p dev cypress:open", 11 | "test:e2e:run": "npm-run-all -p dev cypress:run", 12 | "cypress:open": "cypress open", 13 | "cypress:run": "cypress run", 14 | "test": "jest --watch", 15 | "storybook": "start-storybook -p 3001 -c storybook", 16 | "lint": "eslint --ext .js,.jsx,.ts,.tsx,.md,.mdx .", 17 | "prettier": "prettier \"**/*.+(js|jsx|json|ts|tsx|md|mdx|html|eslintrc|prettierrc)\"", 18 | "format": "yarn prettier --write", 19 | "commit": "git add . && git-cz" 20 | }, 21 | "repository": { 22 | "type": "git", 23 | "url": "git+https://github.com/Daniels887/react-typescript-boilerplate.git" 24 | }, 25 | "keywords": [], 26 | "author": "", 27 | "license": "ISC", 28 | "bugs": { 29 | "url": "https://github.com/Daniels887/react-typescript-boilerplate/issues" 30 | }, 31 | "homepage": "https://github.com/Daniels887/react-typescript-boilerplate#readme", 32 | "devDependencies": { 33 | "@babel/core": "^7.11.0", 34 | "@babel/plugin-proposal-class-properties": "^7.10.4", 35 | "@babel/preset-env": "^7.11.0", 36 | "@babel/preset-react": "^7.10.4", 37 | "@babel/preset-typescript": "^7.10.4", 38 | "@hot-loader/react-dom": "^16.13.0", 39 | "@storybook/addon-controls": "^6.0.16", 40 | "@storybook/addon-docs": "^6.0.15", 41 | "@storybook/addon-viewport": "^6.0.17", 42 | "@storybook/react": "^6.0.15", 43 | "@types/jest": "^26.0.8", 44 | "@types/react": "^16.9.44", 45 | "@types/react-dom": "^16.9.8", 46 | "@typescript-eslint/eslint-plugin": "^3.8.0", 47 | "@typescript-eslint/parser": "^3.8.0", 48 | "babel-eslint": "^10.1.0", 49 | "babel-jest": "^26.2.2", 50 | "babel-loader": "^8.1.0", 51 | "commitizen": "^4.1.2", 52 | "css-loader": "^4.2.0", 53 | "cypress": "^5.0.0", 54 | "eslint": "^7.2.0", 55 | "eslint-config-airbnb": "^18.2.0", 56 | "eslint-config-airbnb-typescript": "^9.0.0", 57 | "eslint-config-prettier": "^6.11.0", 58 | "eslint-plugin-import": "^2.22.0", 59 | "eslint-plugin-jest": "^23.20.0", 60 | "eslint-plugin-jsx-a11y": "^6.3.1", 61 | "eslint-plugin-mdx": "^1.8.1", 62 | "eslint-plugin-prettier": "^3.1.4", 63 | "eslint-plugin-react": "^7.20.5", 64 | "eslint-plugin-react-hooks": "^4.0.0", 65 | "file-loader": "^6.0.0", 66 | "html-webpack-plugin": "^4.3.0", 67 | "husky": "^4.2.5", 68 | "jest": "^26.2.2", 69 | "jest-watch-typeahead": "^0.6.0", 70 | "lint-staged": "^10.2.11", 71 | "npm-run-all": "^4.1.5", 72 | "prettier": "^2.0.5", 73 | "storybook": "^6.0.16", 74 | "typescript": "^3.9.7", 75 | "webpack": "^4.44.1", 76 | "webpack-cli": "^3.3.12", 77 | "webpack-dev-server": "^3.11.0" 78 | }, 79 | "config": { 80 | "commitizen": { 81 | "path": "./node_modules/cz-conventional-changelog" 82 | } 83 | }, 84 | "dependencies": { 85 | "react": "^16.13.1", 86 | "react-dom": "^16.13.1", 87 | "react-hot-loader": "^4.12.21", 88 | "serve": "^11.3.2" 89 | } 90 | } 91 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 |

2 | Webpack     3 |   4 | Typescript 5 | React 6 |

7 |

Boilerplate - React + Typescript + Webpack

8 |
9 |

10 | Technologies   |    11 | Configuration   |    12 | Tests   |    13 | Others   |    14 |

15 | 16 | ## :rocket: Technologies 17 | 18 | - [React](https://reactjs.org) 19 | - [Typescript](https://www.typescriptlang.org/) 20 | - [Webpack](https://webpack.js.org/) 21 | - [Babel](https://babeljs.io/) 22 | - [Storybook](https://storybook.js.org/) 23 | - [Jest](https://jestjs.io/) 24 | - [Cypress](https://www.cypress.io/) 25 | - [Eslint](https://eslint.org/) 26 | - [Prettier](https://prettier.io/) 27 | - [Commitizen](https://github.com/commitizen/cz-cli) 28 | - [Husky](https://github.com/typicode/husky) 29 | - [Serve](https://www.npmjs.com/package/serve) 30 | 31 | ## :wrench: Configuration 32 | 33 | #### 1. Install all dependencies with 34 | 35 | ```sh 36 | $ npm install 37 | ``` 38 | 39 | or using yarn 40 | 41 | ```sh 42 | $ yarn 43 | ``` 44 | 45 | #### 2. Start the webpack-dev-server 46 | 47 | ```sh 48 | $ npm run dev 49 | ``` 50 | 51 | or using yarn 52 | 53 | ```sh 54 | $ yarn dev 55 | ``` 56 | 57 | ## :mag: Tests 58 | 59 | #### 1. Run e2e tests with 60 | 61 | ```sh 62 | $ npm run test:e2e 63 | ``` 64 | 65 | or using yarn 66 | 67 | ```sh 68 | $ yarn test:e2e 69 | ``` 70 | 71 | #### 2. Run e2e tests in terminal with 72 | 73 | ``` 74 | $ npm run test:e2e:run 75 | ``` 76 | 77 | or using yarn 78 | 79 | ``` 80 | $ yarn test:e2e:run 81 | ``` 82 | 83 | #### :exclamation: If Cypress (yarn test:e2e) is still not installed after yarn. Install cypress with: 84 | ```sh 85 | $ npx cypress install 86 | ``` 87 | 88 | 89 | #### 3. Run unit tests with 90 | 91 | ``` 92 | $ npm run test 93 | ``` 94 | 95 | or using yarn 96 | 97 | ``` 98 | $ yarn test 99 | ``` 100 | 101 | ## :gift: Others commands 102 | 103 | ```sh 104 | # Build for web (compiled to build/) 105 | $ npm run build 106 | 107 | # Run for web production (needs npm run build first) 108 | $ npm run start 109 | 110 | # Open storybook 111 | $ npm run storybook 112 | 113 | # Check Eslint errors 114 | $ npm run lint 115 | 116 | # Format all files with prettier 117 | $ npm run format 118 | 119 | # Commit using commitizen 120 | $ npm run commit 121 | ``` 122 | 123 | or using yarn 124 | 125 | ```sh 126 | # Build for web (compiled to build/) 127 | $ yarn build 128 | 129 | # Run for web production (needs yarn build first) 130 | $ yarn start 131 | 132 | # Open storybook 133 | $ yarn storybook 134 | 135 | # Check Eslint errors 136 | $ yarn lint 137 | 138 | # Format all files with prettier 139 | $ yarn format 140 | 141 | # Commit using commitizen 142 | $ yarn commit 143 | ``` 144 | -------------------------------------------------------------------------------- /.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "parser": "babel-eslint", 3 | "parserOptions": { 4 | "ecmaFeatures": { 5 | "jsx": true 6 | } 7 | }, 8 | "plugins": ["jest"], 9 | "env": { 10 | "browser": true, 11 | "jest": true 12 | }, 13 | "extends": [ 14 | "airbnb", 15 | "airbnb/hooks", 16 | "plugin:jest/recommended", 17 | "prettier", 18 | "prettier/react" 19 | ], 20 | "rules": { 21 | "react/jsx-filename-extension": [ 22 | 1, 23 | { 24 | "extensions": [".js", ".jsx", ".mdx"] 25 | } 26 | ], 27 | "import/extensions": [ 28 | 1, 29 | { 30 | "js": "never", 31 | "jsx": "never", 32 | "svg": "always", 33 | "json": "always" 34 | } 35 | ], 36 | "no-console": "off", 37 | "react/jsx-props-no-spreading": "off", 38 | "global-require": "off", 39 | "import/no-extraneous-dependencies": [ 40 | "error", 41 | { 42 | "devDependencies": [ 43 | "__tests__/*.*", 44 | "storybook/*.*", 45 | "typings/*.*", 46 | "/*.*" 47 | ] 48 | } 49 | ], 50 | "react-hooks/exhaustive-deps": "off", 51 | "jsx-a11y/anchor-is-valid": "off", 52 | "react/no-array-index-key": "off", 53 | "no-irregular-whitespace": "off", 54 | "prefer-promise-reject-errors": "off", 55 | "eqeqeq": "off", 56 | "no-restricted-syntax": "off", 57 | "no-await-in-loop": "off", 58 | "no-new-func": "off", 59 | "consistent-return": "off" 60 | }, 61 | "settings": { 62 | "import/resolver": { 63 | "node": {}, 64 | "webpack": { 65 | "config": "webpack.config.dev.js" 66 | } 67 | } 68 | }, 69 | "overrides": [ 70 | { 71 | "files": "**/*.+(md|mdx)", 72 | "extends": ["plugin:mdx/recommended"] 73 | }, 74 | { 75 | "files": "**/*.+(ts|tsx)", 76 | "parser": "@typescript-eslint/parser", 77 | "parserOptions": { 78 | "project": "./tsconfig.json", 79 | "ecmaFeatures": { 80 | "jsx": true 81 | } 82 | }, 83 | "plugins": ["jest", "@typescript-eslint"], 84 | "extends": [ 85 | "airbnb-typescript", 86 | "airbnb/hooks", 87 | "plugin:@typescript-eslint/eslint-recommended", 88 | "plugin:@typescript-eslint/recommended", 89 | "plugin:jest/recommended", 90 | "prettier", 91 | "prettier/react", 92 | "prettier/@typescript-eslint" 93 | ], 94 | "rules": { 95 | "import/extensions": [ 96 | 1, 97 | { 98 | "js": "never", 99 | "jsx": "never", 100 | "ts": "never", 101 | "tsx": "never", 102 | "svg": "always", 103 | "json": "always" 104 | } 105 | ], 106 | "no-console": "off", 107 | "react/jsx-props-no-spreading": "off", 108 | "react/prop-types": "off", 109 | "global-require": "off", 110 | "import/no-extraneous-dependencies": [ 111 | "error", 112 | { 113 | "devDependencies": [ 114 | "storybook/*.*", 115 | "__test__/*.*", 116 | "typings/*.*", 117 | "/*.*" 118 | ] 119 | } 120 | ], 121 | "react-hooks/exhaustive-deps": "off", 122 | "jsx-a11y/anchor-is-valid": "off", 123 | "react/no-array-index-key": "off", 124 | "no-irregular-whitespace": "off", 125 | "prefer-promise-reject-errors": "off", 126 | "spaced-comment": "off", 127 | "eqeqeq": "off", 128 | "no-restricted-syntax": "off", 129 | "no-await-in-loop": "off", 130 | "@typescript-eslint/no-implied-eval": "off", 131 | "no-new-func": "off", 132 | "consistent-return": "off", 133 | "@typescript-eslint/naming-convention": ["off"] 134 | } 135 | } 136 | ] 137 | } 138 | -------------------------------------------------------------------------------- /jest.config.js: -------------------------------------------------------------------------------- 1 | // For a detailed explanation regarding each configuration property, visit: 2 | // https://jestjs.io/docs/en/configuration.html 3 | 4 | module.exports = { 5 | // All imported modules in your tests should be mocked automatically 6 | // automock: false, 7 | 8 | // Stop running tests after `n` failures 9 | // bail: 0, 10 | 11 | // The directory where Jest should store its cached dependency information 12 | // cacheDirectory: "/tmp/jest_rs", 13 | 14 | // Automatically clear mock calls and instances between every test 15 | clearMocks: true, 16 | 17 | // Indicates whether the coverage information should be collected while executing the test 18 | // collectCoverage: false, 19 | 20 | // An array of glob patterns indicating a set of files for which coverage information should be collected 21 | // collectCoverageFrom: undefined, 22 | 23 | // The directory where Jest should output its coverage files 24 | // coverageDirectory: "coverage", 25 | 26 | // An array of regexp pattern strings used to skip coverage collection 27 | // coveragePathIgnorePatterns: [ 28 | // "/node_modules/" 29 | // ], 30 | 31 | // Indicates which provider should be used to instrument code for coverage 32 | // coverageProvider: "babel", 33 | 34 | // A list of reporter names that Jest uses when writing coverage reports 35 | // coverageReporters: [ 36 | // "json", 37 | // "text", 38 | // "lcov", 39 | // "clover" 40 | // ], 41 | 42 | // An object that configures minimum threshold enforcement for coverage results 43 | // coverageThreshold: undefined, 44 | 45 | // A path to a custom dependency extractor 46 | // dependencyExtractor: undefined, 47 | 48 | // Make calling deprecated APIs throw helpful error messages 49 | // errorOnDeprecated: false, 50 | 51 | // Force coverage collection from ignored files using an array of glob patterns 52 | // forceCoverageMatch: [], 53 | 54 | // A path to a module which exports an async function that is triggered once before all test suites 55 | // globalSetup: undefined, 56 | 57 | // A path to a module which exports an async function that is triggered once after all test suites 58 | // globalTeardown: undefined, 59 | 60 | // A set of global variables that need to be available in all test environments 61 | // globals: {}, 62 | 63 | // The maximum amount of workers used to run your tests. Can be specified as % or a number. E.g. maxWorkers: 10% will use 10% of your CPU amount + 1 as the maximum worker number. maxWorkers: 2 will use a maximum of 2 workers. 64 | // maxWorkers: "50%", 65 | 66 | // An array of directory names to be searched recursively up from the requiring module's location 67 | // moduleDirectories: [ 68 | // "node_modules" 69 | // ], 70 | 71 | // An array of file extensions your modules use 72 | moduleFileExtensions: ['js', 'json', 'jsx', 'ts', 'tsx'], 73 | 74 | // A map from regular expressions to module names or to arrays of module names that allow to stub out resources with a single module 75 | // moduleNameMapper: {}, 76 | 77 | // An array of regexp pattern strings, matched against all module paths before considered 'visible' to the module loader 78 | // modulePathIgnorePatterns: [], 79 | 80 | // Activates notifications for test results 81 | // notify: false, 82 | 83 | // An enum that specifies notification mode. Requires { notify: true } 84 | // notifyMode: "failure-change", 85 | 86 | // A preset that is used as a base for Jest's configuration 87 | // preset: undefined, 88 | 89 | // Run tests from one or more projects 90 | // projects: undefined, 91 | 92 | // Use this configuration option to add custom reporters to Jest 93 | // reporters: undefined, 94 | 95 | // Automatically reset mock state between every test 96 | // resetMocks: false, 97 | 98 | // Reset the module registry before running each individual test 99 | // resetModules: false, 100 | 101 | // A path to a custom resolver 102 | // resolver: undefined, 103 | 104 | // Automatically restore mock state between every test 105 | // restoreMocks: false, 106 | 107 | // The root directory that Jest should scan for tests and modules within 108 | // rootDir: undefined, 109 | 110 | // A list of paths to directories that Jest should use to search for files in 111 | // roots: [ 112 | // "" 113 | // ], 114 | 115 | // Allows you to use a custom runner instead of Jest's default test runner 116 | // runner: "jest-runner", 117 | 118 | // The paths to modules that run some code to configure or set up the testing environment before each test 119 | // setupFiles: [], 120 | 121 | // A list of paths to modules that run some code to configure or set up the testing framework before each test 122 | // setupFilesAfterEnv: [], 123 | 124 | // The number of seconds after which a test is considered as slow and reported as such in the results. 125 | // slowTestThreshold: 5, 126 | 127 | // A list of paths to snapshot serializer modules Jest should use for snapshot testing 128 | // snapshotSerializers: [], 129 | 130 | // The test environment that will be used for testing 131 | // testEnvironment: "jest-environment-jsdom", 132 | 133 | // Options that will be passed to the testEnvironment 134 | // testEnvironmentOptions: {}, 135 | 136 | // Adds a location field to test results 137 | // testLocationInResults: false, 138 | 139 | // The glob patterns Jest uses to detect test files 140 | testMatch: ['**/__tests__/**/*.[jt]s?(x)'], 141 | 142 | // An array of regexp pattern strings that are matched against all test paths, matched tests are skipped 143 | // testPathIgnorePatterns: [ 144 | // "/node_modules/" 145 | // ], 146 | 147 | // The regexp pattern or array of patterns that Jest uses to detect test files 148 | // testRegex: [], 149 | 150 | // This option allows the use of a custom results processor 151 | // testResultsProcessor: undefined, 152 | 153 | // This option allows use of a custom test runner 154 | // testRunner: "jasmine2", 155 | 156 | // This option sets the URL for the jsdom environment. It is reflected in properties such as location.href 157 | // testURL: "http://localhost", 158 | 159 | // Setting this value to "fake" allows the use of fake timers for functions such as "setTimeout" 160 | // timers: "real", 161 | 162 | // A map from regular expressions to paths to transformers 163 | transform: { 164 | '^.+\\.(js|jsx|ts|tsx)$': 'babel-jest' 165 | }, 166 | 167 | // An array of regexp pattern strings that are matched against all source file paths, matched files will skip transformation 168 | // transformIgnorePatterns: [ 169 | // "/node_modules/" 170 | // ], 171 | 172 | // An array of regexp pattern strings that are matched against all modules before the module loader will automatically return a mock for them 173 | // unmockedModulePathPatterns: undefined, 174 | 175 | // Indicates whether each individual test should be reported during the run 176 | // verbose: undefined, 177 | 178 | // An array of regexp patterns that are matched against all source file paths before re-running tests in watch mode 179 | // watchPathIgnorePatterns: [], 180 | 181 | // Whether to use watchman for file crawling 182 | // watchman: true, 183 | watchPlugins: [ 184 | 'jest-watch-typeahead/filename', 185 | 'jest-watch-typeahead/testname' 186 | ] 187 | } 188 | --------------------------------------------------------------------------------