Support eslint-config-prettier/@typescript-eslint to fix false indentation errors

[brimtown]

Bug Template

Actual Behavior

On a project using Typescript and Prettier, CodeClimate UI and codeclimate analyze report instances of indentation errors that local eslint doesn't.

Expected Behavior

CodeClimate behaves the same as our local eslint config, and correctly uses Prettier's values for indentation.

Steps to reproduce

I see a warning that says Module not supported: eslint-config-prettier/@typescript-eslint, which may be relevant here.

codeclimate.yml

version: "2"
checks:
  method-lines:
    config:
      threshold: 50
engines:
  eslint:
    enabled: true
    channel: eslint-5
    config:
      config: ./packages/client/.eslintrc.js
      extensions:
        - .js
        - .jsx
        - .ts
        - .tsx
  duplication:
    enabled: false

exclude_paths:
  - .cache/*
  - node_modules/*
  - packages/node-service/*
  - packages/client/node_modules/*
  - packages/client/.cache/*
  - packages/client/coverage/*

.eslint.js

module.exports = {
  parser: '@typescript-eslint/parser',
  parserOptions: {
    ecmaVersion: 6,
    sourceType: 'module',
    ecmaFeatures: {
      jsx: true,
    },
    project: './tsconfig.json',
  },
  env: {
    node: true,
    browser: true,
    jest: true,
  },

  plugins: ['@typescript-eslint', 'prettier'],
  extends: [
    'airbnb',
    'plugin:@typescript-eslint/recommended',
    'prettier',
    'prettier/react',
    'prettier/@typescript-eslint',
    'plugin:prettier/recommended',
  ],
  rules: {
    /* Disable React rules that conflict with TypeScript */
    'react/prop-types': 'off',
    'react/jsx-filename-extension': [1, { extensions: ['.jsx', '.tsx'] }],
    'import/prefer-default-export': 'off',
    'react/default-props-match-prop-types': 'off',
    '@typescript-eslint/explicit-function-return-type': 'off',
    /* Team Rules */
    'import/no-extraneous-dependencies': [
      'error',
      {
        devDependencies: true,
      },
    ],
  },
  settings: {
    'import/resolver': {
      node: {
        /* Which extensions should be left off import statements */
        extensions: ['.js', '.jsx', '.ts', '.tsx', '.json'],
      },
    },
  },
  overrides: [
    {
      files: ['*.js'],
      rules: {
        '@typescript-eslint/no-var-requires': 'off',
      },
    },
  ],
};

Output from CODECLIMATE_DEBUG=1 codeclimate analyze -e eslint

my-project git:add-code-climate ❯ CODECLIMATE_DEBUG=1 codeclimate analyze -e eslint
Starting analysis
I, [2019-05-15T20:45:37.765922 #1]  INFO -- : starting engine eslint
D, [2019-05-15T20:45:37.819881 #1] DEBUG -- : /config.json content: {"enabled"=>true, "channel"=>"eslint-5", "config"=>{"config"=>"./packages/client/.eslintrc.js", "extensions"=>[".js", ".jsx", ".ts", ".tsx"]}, "include_paths"=>[".DS_Store", "yarn-error.log", ".npmrc", "docs/", "README.md", "yarn.lock", ".dockerignore", "docker-entrypoint.sh", ".gitignore", "package.json", "tsconfig.build.json", "scripts/", "packages/client/.babelrc", "packages/client/gatsby-ssr.js", "packages/client/__mocks__/", "packages/client/.out/", "packages/client/.DS_Store", "packages/client/yarn-error.log", "packages/client/.storybook/", "packages/client/.editorconfig", "packages/client/README.md", "packages/client/gatsby-browser.js", "packages/client/public/", "packages/client/.gitignore", "packages/client/package.json", "packages/client/tslint.json", "packages/client/tsconfig.build.json", "packages/client/gatsby-config.js", "packages/client/.prettierrc", "packages/client/gatsby-node.js", "packages/client/.eslintrc.js", "packages/client/tsconfig.json", "packages/client/.eslintignore", "packages/client/jest-preprocess.js", "packages/client/.env.development", "packages/client/jest-config.js", "packages/client/src/", ".prettierrc", "tsconfig.json", "docker-compose.yml", "lerna.json", ".circleci/", ".codeclimate.yml"], "debug"=>"1"}
D, [2019-05-15T20:45:37.842341 #1] DEBUG -- : docker run: ["docker", "run", "--name", "cc-engines-eslint-eslint-5-a03ac350-5fe8-40ba-a8ec-7810e315ffbd", "--cap-drop", "all", "--label", "com.codeclimate.label=d10cd724-9b1f-4585-9db5-9133f388f04b", "--log-driver", "none", "--memory-swap", "-1", "--net", "none", "--rm", "--volume", "/Users/tim.brown/work/my-project:/code:ro", "--volume", "/tmp/cc/6abc5e93-6ae3-4d54-a181-1d2dce164be0:/config.json:ro", "--user", "9000:9000", "--memory", "1024000000", "codeclimate/codeclimate-eslint:eslint-5"]
D, [2019-05-15T20:45:39.106586 #1] DEBUG -- : engine stderr: Module not supported: eslint-config-prettier/@typescript-eslint
D, [2019-05-15T20:45:40.239168 #1] DEBUG -- : engine stderr: ESLint is running with the /usr/local/node_modules/@typescript-eslint/parser/dist/parser.js parser.
D, [2019-05-15T20:45:40.302616 #1] DEBUG -- : engine stderr: Ignoring the following rules that rely on module resolution:
D, [2019-05-15T20:45:40.302863 #1] DEBUG -- : engine stderr:
D, [2019-05-15T20:45:40.303023 #1] DEBUG -- : engine stderr: * import/extensions
D, [2019-05-15T20:45:40.303352 #1] DEBUG -- : engine stderr: * import/no-unresolved
D, [2019-05-15T20:45:40.303423 #1] DEBUG -- : engine stderr: * import/no-extraneous-dependencies
D, [2019-05-15T20:45:40.303450 #1] DEBUG -- : engine stderr: * import/no-named-as-default
D, [2019-05-15T20:45:40.303647 #1] DEBUG -- : engine stderr: * import/named
D, [2019-05-15T20:45:40.304028 #1] DEBUG -- : engine stderr: * import/no-absolute-path
D, [2019-05-15T20:45:40.304072 #1] DEBUG -- : engine stderr: * import/no-duplicates
D, [2019-05-15T20:45:40.304104 #1] DEBUG -- : engine stderr: * import/no-named-as-default-member
D, [2019-05-15T20:45:40.304196 #1] DEBUG -- : engine stderr: * import/no-cycle
D, [2019-05-15T20:45:40.304597 #1] DEBUG -- : engine stderr:
D, [2019-05-15T20:45:40.304675 #1] DEBUG -- : engine stderr: Ignoring the following settings that rely on module resolution:
D, [2019-05-15T20:45:40.304865 #1] DEBUG -- : engine stderr:
D, [2019-05-15T20:45:40.304938 #1] DEBUG -- : engine stderr: * import/resolver
D, [2019-05-15T20:45:54.756548 #1] DEBUG -- : engine stdout: {"type":"issue","categories":["Style"],"check_name":"@typescript-eslint/indent","description":"Expected indentation of 4 spaces but found 2.","content":{"body":"For more information visit Source: http://eslint.org/docs/rules/\n"},"location":{"path":"packages/client/gatsby-config.js","positions":{"begin":{"line":2,"column":1},"end":{"line":2,"column":1}}},"remediation_points":50000}
D, [2019-05-15T20:45:54.776281 #1] DEBUG -- : engine stdout:

{"type":"issue","categories":["Style"],"check_name":"@typescript-eslint/indent","description":"Expected indentation of 4 spaces but found 2.","content":{"body":"For more information visit Source: http://eslint.org/docs/rules/\n"},"location":{"path":"packages/client/gatsby-config.js","positions":{"begin":{"line":8,"column":1},"end":{"line":8,"column":1}}},"remediation_points":50000}
D, [2019-05-15T20:45:54.785352 #1] DEBUG -- : engine stdout:

# ... 300 other instances of indentation errors

[brimtown]

Hi @filipesperandio ! Is there any more information I can provide here?

[filipesperandio]

@brimtown Is there a public repo we can use for testing?

[filipesperandio]

Fixed by #458

@brimtown Let me know if you see any issues.

[brimtown]

Thanks @filipesperandio ! I'm seeing this now in the UI, although codeclimate analyze does work correctly locally.

EDIT: On closer inspection, I also get this same error message locally with codeclimate analyze if I run it with the eslint-4 engine. Looks like codeclimate.com isn't respecting the engine choice in codeclimate.yml for some reason, but that may be a separate issue.

[filipesperandio]

@brimtown Can you confirm that is the error you are getting even with eslint-5 set up?

[brimtown]

@filipesperandio I was not getting that error with eslint-5 set up locally with codeclimate analyze, but I was seeing it in the UI with eslint-5 set via .codeclimate.yml.

But it looks like everything is working fine now, seems to have either been a caching issue, or the PR integration linking to an old build. Thank you!