when trying to use it with create-react-app, it breaks with non-null (!) operator

[standard]

when trying to use it with create-react-app, it breaks with non-null (!) operator

[ospfranco]

just in case other people run into the same issue:

You are not supposed to change the "jsx" version in tsconfig, that happens because you are using vscode integrated typescript, whereas create-react-app is already a few versions ahead, you can revert your change and use 'rect-jsx' if you tell vscode to use the packaged typescript inversion from node_modules instead of the bundled one

As for the other stuff, I ran into more problems with the rules, 100% explicit typing for example, that is just a waste of time so I really gave up on trying to stick to this flavor of standard and I'm using pure eslint with the typescript-eslint-standard rule set which allows for customization, I know it is not the philosophy of standard but I think current ts rule set is too strict for it's own good.

Thanks for the support anyways

[ospfranco]

A bit more information, I added the following config on my package.json:

"ts-standard": {
"parser": "babel-eslint",
"env": [
"jest",
"es6",
"browser"
],
"ignore": [
"build/*"
]
}

and on my workspace settings:

{
  "typescript.tsdk": "node_modules/typescript/lib",
  "standard.autoFixOnSave": true,
  "javascript.validate.enable": false,
  "standard.engine": "ts-standard",
  "standard.usePackageJson": true
}

and that effectively got rid of the error on vscode, however when running on the browser, the error pops again and breaks the compilation of the program

[ospfranco]

never mind, nothing wrong with this package, seems it is disabled on the eslint rule set itself

mightyiam/eslint-config-love#422

the fact there is no description of the error though, is very very confusing

[LinusU]

@ospfranco is your file ending in .js? This isn't the rule that is complaining, the parser is complaining that it can't understand the file (since ! there is only valid TypeScript, not JavaScript)

[ospfranco]

no, my file is valid typescript, after I removed ts-standard and manually installed the standard-typescript-eslint configuration and modified the rule myself it ran without problems

[LinusU]

my file is valid typescript

Yes, exactly. But it isn't valid JavaScript, and it seems like ts-standard is trying to parse the file as JavaScript. I'm trying to figure out why that is.

Is the file extension of your file .js, or is it .ts?

Potentially ts-standard looks at the file ending, whilst a custom eslintrc config wouldn't...

[ospfranco]

no, it was a .ts file

[LinusU]

Interesting, I don't have time to setup a create-react-app and test right now, but it should work out of the box with ts-standard so something is broken 🤔

[toddbluhm]

So update on this from my end.

I just created a default create-react-app using the following command npx create-react-app my-app --template typescript --use-npm.

I then proceeded to install ts-standard and run ts-standard --fix there were a few errors (because the template is not standard compliant). I also had to update the tsconfig.json to use "jsx": "react" instead of "react-jsx" which does not exist.

After fixing all of that, ts-standard ran as expected. One thing I noticed in the original config sent was the usage of babel-eslint for the parser setting. When I added that, everything went crazy and ts-standard broke. ts-standard already includes the correct parser so there is rarely ever a reason to change the parser. If you wish to change the parser I suggest just using standard with the custom parser instead.

If someone really wants to make ts-standard compatible with the babel parser, they are welcome to open a PR for it. I suspect it will be quite challenging as babel's typescript parser does not support the full typescript language specification.

[toddbluhm]

@ospfranco thanks for the great feedback. I appreciate all of it and I do understand your concern about the rules. Please feel free to open an issue regarding the rules or a specific rule in https://github.com/standard/eslint-config-standard-with-typescript where all the rules are determined and can be changed. The Typescript side of the rules is very much still evolving and changing as more people begin to use them, so any and all rule change suggestions are welcomed 😄