Getting Parsing error: Unexpected token, expected ";"

Viewed 13682

I'm working on a big React + TypeScript project.

It works well on the local machine of other colleagues, but on mine I get the following error:

Line 1:  Parsing error: Unexpected token, expected ";"

as you can see below:

enter image description here

Here is the source code:

export type LoadOfferType = typeof import("../offers/defaultOffer");

export const loadOffer = async (): Promise<LoadOfferType> => {
  const offerName = process.env.NODE_ENV === "development" ? process.env.REACT_APP_FALLBACK_SITE : "defaultOffer";

  /**
   * We use a switch statement instead of ane xpression for the offer path
   * because Webpack throws a critical dependency error when using paths
   * that are not explicitly defined.
   */
  switch (offerName) {
    case "mysite.com":
      return await import("../offers/mysite.com");
    default:
      return await import("../offers/defaultOffer");
  }
};

The commands I ran after cloning the repository were:

$ yarn install
$ yarn start

Here there is some info about my system:

$ node -v
v12.13.0

$ npm -v
6.12.0

$ yarn -v
1.19.1

Any idea on how to fix this?

Thanks!

3 Answers

A couple of things could be happening. Have you created a ts.config.js with ts configuration and parser config, something like:

 export const typescriptConfig = {
 extends: ['plugin:@typescript-eslint/eslint- 
 recommended'],
 overrides: [
   {
     parser: '@typescript-eslint/parser',
     extends: [
       'plugin:@typescript-eslint/recommended',
       'prettier/@typescript-eslint',
       'plugin:import/typescript',
     ],
     plugins: ['@typescript-eslint'],

     files: ['*.ts', '*.tsx'],

     rules: {},
   },
 ],

}

Create React App uses ESLint by default. However, ESLint can't parse TypeScript by default. If you want, you may consider using @typescript-eslint/parser.

This could be that the base babel-eslint parser not working correctly without any config. ESLint is not applying different parsers to different files, hence babel-eslint might be throwing an error.

Make sure your config file is created in the root of the project. I would start with that.

You are definitely on an old version of TypeScript. Your syntax is perfectly valid.

Tested

Example test done locally. enter image description here

Ended up here because I accidentally was doing

{
  items ?? [],
}

when I should have been doing

{
  items: items ?? [],
}
Related