'Unexpected token, expected ")"' on catch block when adding Typescript to ReactJS project?
I'm converting a ReactJS project to use Typescript. When I compile the project, on the catch block in try/catch
statements,
...
} catch (e: any) {
console.log(e);
}
I get the following error
Syntax error: Unexpected token, expected ")" (243:15)
241 | ...
242 | });
> 243 | } catch (e: any) {
| ^
244 | console.log(e);
245 | }
246 | };
This is my tsconfig.json
{
"compilerOptions": {
"target": "ES2017",
"lib": ["dom", "dom.iterable", "esnext"],
"allowJs": true,
"skipLibCheck": true,
"esModuleInterop": true,
"allowSyntheticDefaultImports": true,
"strict": true,
"forceConsistentCasingInFileNames": true,
"noFallthroughCasesInSwitch": true,
"module": "esnext",
"moduleResolution": "node",
"resolveJsonModule": true,
"isolatedModules": true,
"noEmit": true,
"jsx": "react-jsx"
},
"include": ["src"]
}
This project was created using create-react-app
.
I'm not sure how to troubleshoot this. The only option I have right now, is to remove the (e:any)
, and have a generic error message.
Any help on this would be greatly appreciated. This is the first time I'm converting a ReactJS project to use Typescript.
Thank you!
You cannot put type annotation in catch
block as you don't know what error will be thrown.
Workaround is to use instanceof
to check which error you got
catch (e) {
if(e instanceof RangeError) {
// e is now RangeError
} else if (e instanceof TypeError) {
// e is now TypeError
} else {
// anything else
}
}
Source: https://fettblog.eu/typescript-typing-catch-clauses/