How to enable support for JSX?

[trusktr]

What version of TypeScript are you using?

2.9.1

What version of typescript-eslint-parser are you using?

17.0.1

(compatible with ts version, as I don't get the arning in the console)

What code were you trying to parse?

const div = (
	<div>
		<span className="foo">hello</span>
	</div>
)

What did you expect to happen?

It should work with JSX.

What happened?

❯ eslint -c ./.eslintrc.js test.ts

/Users/trusktr/test.ts
  3:8  error  Parsing error: '>' expected

✖ 1 problem (1 error, 0 warnings)

(3:8 is right at the beginning of className)

I read the README, and I don't see any mention of JSX or how to turn on support for it.

eslintrc

module.exports = {
	extends: ['prettier'],
	parser: 'babel-eslint',
	parserOptions: {
		sourceType: 'module',
	},

	overrides: [
		{
			files: ['*.ts', '*.tsx'],
			parser: 'typescript-eslint-parser',
		},
	],
}

I am not trying to lint anything, I just want to check syntax errors (hence the simple eslintrc).

[trusktr]

Oooooooooooooooooh, I need to add the ecmaFeatures to parserOptions:

module.exports = {
	extends: ['prettier'],
	parser: 'babel-eslint',
	parserOptions: {
		sourceType: 'module',
	},

	overrides: [
		{
			files: ['*.ts', '*.tsx'],
			parser: 'typescript-eslint-parser',
			parserOptions: {
				ecmaFeatures: {
					jsx: true,
				},
			},
		},
	],
}

This wasn't very clear. Maybe the readme should cover which options is supports compared to other parsers, because it wasn't obvious that I should assume these parser options are the same as (for example) babel-eslint.

[trusktr]

PR for updating README: #530