Error: r is not a constructor

[KaniDev]

Hi ! This seems to have been a past issue, but seems to have come back recently.
Environment: Arch Linux, VSCode 1.67.2, node v16.14.2 (LTS), using the default Next TS app.

Using format on save, each time i save, I get a new "Error: r is not a constructor" in the output tab.

Steps to reproduce:

• Create a next app: yarn create next-app --typescript
• Add the dependencies as the README specifies: yarn add -D prettier@^2.5.1 eslint@^8.7.0 @typescript-eslint/parser@^5.0.1 typescript@^4.4.4 prettier-eslint
• Set formatter as Prettier ESLint in VSCode
• Format
• Watch output tab

[idahogurl]

@KaniDev Have you looked at the TypeScript examples? https://github.com/idahogurl/vs-code-prettier-eslint/tree/master/examples/typescript

I'm able to reproduce the issue because you have not fully setup your ESLint config. Also, what version of the extension are you using?

[mjvestal]

I am also getting this error.

I have v3.1.0 of the extension. I am not using typescript. My ESLint config is

module.exports = {
  env: {
    browser: true,
    es2021: true,
    jest: true,
  },
  extends: [
    'airbnb-base',
  ],
  parserOptions: {
    ecmaVersion: 'latest',
    sourceType: 'module',
  },
  rules: {
  },
};

Running the prettier-eslint CLI with --write updates my JS files. But when I enable the extension to format on save, I see Error: r is not a constructor in the Output tab whenever I save a file.

[idahogurl]

@mjvestal Version 3.10 only works with Prettier 1.9 and ESLint 6.8. You need to use the Prerelease Versions for Prettier 2 & ESLint 7 or 8. See https://github.com/idahogurl/vs-code-prettier-eslint/tree/3.x#installation. Version 4 supports ESLint 7 and Version 5 supports ESLint 8

[shhac]

@idahogurl Getting this error too; I have projects using ESLint 7 and all of the "Version 4" of this extension aren't advertised when I go to install a specific version

[idahogurl]

@shhac

1. Download the extension here https://marketplace.visualstudio.com/_apis/public/gallery/publishers/rvest/vsextensions/vs-code-prettier-eslint/4.1.0/vspackage
2. In VS Code, click Extensions > ... > Install from VSIX

[github-actions]

This issue is stale because it has been open for 14 days with no activity.

[github-actions]

This issue was closed because it has been inactive for 14 days since being marked as stale.

[josephdpurcell]

I believe I ran into this issue, and I assume this is similar to #16 and #26.

I noticed on my backend files which use ESlint 7.32 Prettier Eslint worked fine. But, my frontend files which use 6.8 I would receive an error in the OUTPUT -> Prettier Eslint:

Error: r is not a constructor
TypeError: r is not a constructor
...stack trace .vscode/extensions/rvest.vs-code-prettier-eslint-5.0.4/dist/extension.js:180:69
...more stack trace

I thought this was working fine at one point. I see that VSCode extension Prettier Eslint released v5 in Apr 2022. It's possible I simply missed the upgrade happening and that this issue is related to the upgrade, it sounds like that might be the case based on this thread.

I see now that the README https://github.com/idahogurl/vs-code-prettier-eslint#support-for-earlier-versions says if you want to use ESLint lower than 8 you must download and manually install a different version of the extension. Just like @idahogurl explains above.

I downgraded the Prettier ESLint extension from 5.0.4 to 4.1.0 and the error no longer occurs. This comment was helpful in explaining how to do that: #41 (comment).

[josephdpurcell]

Important note: because v4 is not available in the marketplace, I had to disable VSCode's auto-update of extensions. The auto-update of extensions will uninstall the manually installed version 4.1.0 because a newer version 5.0.4 is available.

It would be excellent if the 4.1.0 version was available in the marketplace. Or, if someone can identify a way to allow this extension to be pinned at 4.1.0 while allowing other extensions in VSCode to continue to be updated.

[idahogurl]

@josephdpurcell May I ask why upgrading to ESLint 8 is an issue? Is it because of an older Node version?

[josephdpurcell]

@idahogurl Yes, I need to keep the versions pinned where they are for ESLint and related packages. Certainly, as time approaches infinity, it will get upgraded to ESLint >= 8 or replaced, but for now it is ideal to avoid the effort to upgrade.

[idahogurl]

@josephdpurcell I did find this. https://stackoverflow.com/questions/51965933/how-to-stop-a-single-vs-code-extension-from-auto-update

[josephdpurcell]

Interesting! Ok, I tried that, and assuming I did the steps correctly it didn't work. Here's what I tried:

1. Uninstall Prettier ESLint v5.0.4 (reload required)
2. Disable checking for extension updates and disable installing extension updates automatically
3. Install Prettier ESLint v4.1.0 from vsix
4. Edit the package.json to change the __metadata.id as described in the StackOverflow answer, file is at ~/.vscode/extensions/rvest.vs-code-prettier-eslint-4.1.0/package.json
5. Restart VSCode
6. Re-enable checking for extension updates and re-enable installing extension updates automatically

At this point, VSCode automatically updates from v4.1.0 to v5.0.4 again.