typescript compiled js files eslint configuration

Question

I achieved to configure a VS code project according to the airbnb and typescript config, and finally the typescruipt code linting behaves as expected.

Find the .eslintrc.js:

const path = require('path'); module.exports = { root: true, env: { browser: true, jquery: true }, extends: [ 'airbnb/base', 'plugin:@typescript-eslint/recommended', ], parserOptions: { parser: 'parser: '@typescript-eslint/parser', ecmaVersion: 2018, sourceType: 'module', }, settings: { 'import/resolver': { alias: { map: [ ['@', path.resolve(__dirname, 'src')], ], extensions: [ '.js', '.js', '.json', ], }, }, }, rules: { 'comma-dangle': ['error', { 'arrays': 'always-multiline', 'objects': 'always-multiline', 'imports': 'always-multiline', 'exports': 'always-multiline', 'functions': 'never' }], 'function-paren-newline': ['error', 'consistent'], 'no-alert': 0, 'no-bitwise': 0, 'no-console': 0, 'no-param-reassign': 0, 'no-shadow': 0, 'jsx-a11y/anchor-is-valid': 0, 'jsx-a11y/click-events-have-key-events': 0, 'jsx-a11y/label-has-associated-control': 0, 'jsx-a11y/label-has-for': 0, 'jsx-a11y/no-autofocus': 0, 'jsx-a11y/no-noninteractive-element-interactions': 0, 'jsx-a11y/no-static-element-interactions': 0, 'linebreak-style': [0, "windows"], 'camelcase' : 0, 'no-plusplus' : 0, 'no-underscore-dangle' : 0, 'no-buffer-constructor:': 0 }, };

However, es-lint also works for the typescript compiled .js files, which I dont want to. I tried with the tsc compiler and prettier plugin to have these compiled according to the airbnn rules which I think is the most desirable. Another option would be to disable eslint for the js files. I have checked many articles about how to configure a proyect to work with typescript which I already achieved, but I am missing this last step of what happens to the .js compiled files regarding to linting and how to configure that. Also how to compile many files at once when you are working with many files in a proyect.

Apart from my concrete doubt, any comments regarding the typescript working flow is appreciated. I guess that you compile all your tsc files and set as your app entry point the corresponding tsc compiled .js file, but I am not sure if its like that.

Many thanks in advance.

Alex Wayne · Accepted Answer · 2020-06-16 22:28:23Z

2

You can configure eslint to ignore certain files or directories

If you have your app being compiled to a build directory, you might have this in your eslint:

"ignorePatterns": ["build"]

Or if you want to ignore all .js files regardless of where they get compiled to:

"ignorePatterns": ["**/*.js"]

Or use similar patterns in a .eslintignore file.

answered Jun 16, 2020 at 22:28

Alex Wayne

188k52 gold badges328 silver badges363 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

rustyBucketBay Over a year ago

thanks, that was useful. And what is usually done, compile all the tsc files to one folder, and ignore that for linting?

Alex Wayne Over a year ago

Yeah, exactly. add something like "outDir": "build" to tsconfig.json and then you can easily sequester compiled code from all your typescript code. It makes it very easily to treat it differently that way.

rustyBucketBay Over a year ago

Nice. Thank you so much

Collectives™ on Stack Overflow

typescript compiled js files eslint configuration

1 Answer 1

3 Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Linked

Related