Microsoft Rush + ESLint + VS Code Setup

rush-eslint.md

Microsoft Rush + ESLint + VS Code Setup

Use the following code in .eslintrc.js in node/backend projects:

// This is a workaround for https://github.com/eslint/eslint/issues/3458
require('@rushstack/eslint-config/patch/modern-module-resolution')

module.exports = {
  extends: [
    '@rushstack/eslint-config/profile/node',
    '@rushstack/eslint-config/mixins/friendly-locals'
  ],
  parserOptions: { tsconfigRootDir: __dirname },

  overrides: [
    /**
     * Override the parser from @rushstack/eslint-config. Since the config is coming
     * from the workspace instead of the external NPM package, the versions of ESLint
     * and TypeScript that the config consumes will be resolved from the devDependencies
     * of the config instead of from the eslint-7-test package. Overriding the parser
     * ensures that the these dependencies come from the eslint-7-test package. See:
     * https://github.com/microsoft/rushstack/issues/3021
     */
    {
      files: ['*.ts', '*.tsx'],
      parser: '@typescript-eslint/parser',
    },
  ],
}

Use the following code in .eslintrc.js in react/front-end projects:

// This is a workaround for https://github.com/eslint/eslint/issues/3458
require('@rushstack/eslint-config/patch/modern-module-resolution')

module.exports = {
  extends: [
    '@rushstack/eslint-config/profile/web-app',
    '@rushstack/eslint-config/mixins/react',
  ],
  parserOptions: { tsconfigRootDir: __dirname },

  settings: {
    react: {
      version: '17.0.2',
    },
  },
  overrides: [
    /**
     * Override the parser from @rushstack/eslint-config. Since the config is coming
     * from the workspace instead of the external NPM package, the versions of ESLint
     * and TypeScript that the config consumes will be resolved from the devDependencies
     * of the config instead of from the eslint-7-test package. Overriding the parser
     * ensures that the these dependencies come from the eslint-7-test package. See:
     * https://github.com/microsoft/rushstack/issues/3021
     */
    {
      files: ['*.ts', '*.tsx'],
      parser: '@typescript-eslint/parser',
    },
  ],
}

Run the following commands in each of the project folders where you added .eslintrc.js:

rush add --dev -p @rushstack/eslint-config
rush add --dev -p @typescript-eslint/parser

Remove/comment out the following config if present in your VS Code settings:

  "eslint.options": {
    "overrideConfigFile": "./.eslintrc.js"
  },