React, typescript, use craco to set custom tests paths and import aliases

.eslintrc

{
  "extends": [
    "eslint-config-react-app"
  ],
  "plugins": ["react", "import"],
  "rules": {
    "import/no-unresolved": "error"
  },
  "settings": {
    "import/parsers": {
      "@typescript-eslint/parser": [".ts", ".tsx"]
    },
    "react": {
      "pragma": "React",
      "version": "detect"
    },
    "import/resolver": {
      "typescript": {
        "alwaysTryTypes": true
      }
    }
  }
}

craco.config.js

const path = require("path");
const { ESLINT_MODES } = require("@craco/craco");
const resolve = arg => path.resolve(__dirname, arg)

module.exports = {
  webpack: {
    alias: {
      "~": resolve("src/")
    }
  },
  jest: {
    configure: {
      moduleNameMapper: {
        "^~(.*)$": "<rootDir>/src$1",
      },
      roots: ["<rootDir>/src/", "<rootDir>/test/"],
      testMatch: ["<rootDir>/test/**/?(*.)+(spec|test).[jt]s?(x)"],
      setupFilesAfterEnv: "<rootDir>/test/setupTests.ts"
    }
  },
  eslint: {
    mode: ESLINT_MODES.file
  }
};

package.json

"devDependencies": {
    "@craco/craco": "^5.6.4",
    "@typescript-eslint/parser": "^2.27.0",
    "eslint-import-resolver-typescript": "^2.0.0",
    "eslint-plugin-import": "^2.20.2"
  }

React-Craco.md

Created APP with create-react-app & typescript

´npx create-react-app my-app --template typescript´

Uses [craco](craco https://github.com/gsoft-inc/craco) for overriding config

tsconfig.json

{
  "extends": "./tsconfig.paths.json", // need to be in a different file
  "compilerOptions": {
    "target": "es5",
    "lib": [
      "dom",
      "dom.iterable",
      "esnext"
    ],
    "allowJs": true,
    "skipLibCheck": true,
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    "strict": true,
    "forceConsistentCasingInFileNames": true,
    "module": "esnext",
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "noEmit": true,
    "jsx": "react"
  },
  "include": [
    "src/**/*",
    "test/**/*" // need to include test dirs
  ],
  "exclude": [
    "node_modules",
    "**/node_modules/*"
  ]
}

tsconfig.paths.json

{
  "compilerOptions": {
    "baseUrl": "./",
    "paths": {
      "~/*": [
        "src/*"
      ]
    }
  }
}