My typescript project config memo

babel.config.js

const isDev = process.env.NODE_ENV === 'development';

module.exports = {
  sourceMaps: isDev ? 'inline' : true,
  presets: [
    ['next/babel', { loose: true, useBuiltIns: 'usage' }],
    [require('@babel/preset-typescript'), { isTSX: true, allExtensions: true }],
  ],
  plugins: [
    [require('@babel/plugin-proposal-decorators'), { decoratorsBeforeExport: false }],
    [require('@babel/plugin-proposal-class-properties'), { loose: true }],
    [require('@babel/plugin-transform-react-inline-elements'), {}],
    [require('@babel/plugin-transform-react-constant-elements'), { allowMutablePropsOnTags: [] }],
    [require('babel-plugin-idx'), {}],
    [
      require('babel-plugin-import'),
      {
        libraryName: 'antd',
        style: 'css',
      },
    ],
  ],
};

postcss.config.js

module.exports = {
  plugins: {
    'postcss-import': {},
    'postcss-normalize': {},
    'postcss-preset-env': {
      stage: 2,
      features: {
        'nesting-rules': true,
        'custom-selectors': true,
        'custom-media-queries': true,
      },
    },
    colorguard: {},
    'css-mqpacker': {},
  },
};

tsconfig.json

{
  "compilerOptions": {
    "allowSyntheticDefaultImports": true,
    "experimentalDecorators": true,
    "jsx": "preserve",
    "lib": ["dom", "esnext"],
    "module": "esnext",
    "moduleResolution": "node",
    "noImplicitReturns": true,
    "noImplicitThis": true,
    "noImplicitAny": true,
    "removeComments": true,
    "sourceMap": true,
    "strict": true,
    "target": "esnext"
  },
  "include": ["pages/**/*", "components/**/*", "utils/**/*"],
  "exclude": ["node_modules", ".next"]
}

tslint.json

{
  "defaultSeverity": "error",
  "extends": ["tslint-config-airbnb", "tslint-react", "tslint-config-prettier"],
  "rules": {
    "one-variable-per-declaration": false,
    "variable-name": [true, "ban-keywords", "check-format", "allow-pascal-case"],
    "import-name": [
      true,
      {
        "react": "React"
      }
    ]
  }
}