Prettier-vscode: Cannot find module '../ast-utils' when formating

Created on 12 Dec 2018  ·  68Comments  ·  Source: prettier/prettier-vscode

Hi all,

I'm getting the following error after installing prettier-vscode and trying to format a file.

Cannot find module '../ast-utils'

I have no idea about what's happening.

locked

Most helpful comment

Same problem here with eslint 6.

rm -rf node_modules and npm i did not help.

Error:

Cannot find module '../util/ast-utils'

All 68 comments

Hi,
Same error solved by remplacing the User Settings.json file in vs code. Make it basic like that

{
"terminal.integrated.fontFamily": "Fira mono for Powerline",
"window.zoomLevel": 1,
"editor.formatOnSave": true
}

I just got the same issue

I think it's related to eslint version as I am using this setting "prettier.eslintIntegration": true
and it's what causing the issue and this issue just happened to me after upgrading to eslint version ^5.12.0

The error doesn't provide much context, so I did grep ast-utils -R node_modules/. All the hits were inside eslint, so this is almost certainly an eslint issue. I noticed that my node_modules folder had two copies of eslint, since my project depended on a different version (5.9.0) than prettier-eslint itself (^4.0.0).

Switching my project to depend on the same eslint as prettier-eslint (specifically, ^4.0.0) solved the problem for me.

had the same issue, @swansontec was right, had two eslints in my node_modules

rm -rf node_modules && yarn solved my issues

Is there any resolution for this? Encountering this on eslint 5.16.0

@iRoachie, have you tried rm -rf node_modules and then running npm or yarn again as @mrsufgi suggested?

Looks like I have the same problem. Re-installing node_modules with yarn didn't do it for me. I'm using eslint 6.0.

I am using "prettier.eslintIntegration": false for now and that works. Not sure if I need it.

I think this is down to:

warning " > [email protected]" has incorrect peer dependency "[email protected] - 5.x".

Reverting to eslint 5.16.0 works for now.

@nfantone If I go back to 5.16.x I get errors like:

Failed to load plugin '@typescript-eslint' declared in 'CLIOptions'/myproject/src/index.ts:: Cannot find module '@typescript-eslint/eslint-plugin'
Require stack:
- /__placeholder__.js

Same problem here with eslint 6.

rm -rf node_modules and npm i did not help.

Error:

Cannot find module '../util/ast-utils'

@CiGit this is urgent now with the new eslint 6 released.

this error happens in windows, in my mac, is fine

https://github.com/benmosher/eslint-plugin-import/pull/1393 is merged and release but still the same problem. This is urgent. I'm crying...

The error doesn't provide much context, so I did grep ast-utils -R node_modules/. All the hits were inside eslint, so this is almost certainly an eslint issue. I noticed that my node_modules folder had two copies of eslint, since my project depended on a different version (5.9.0) than prettier-eslint itself (^4.0.0).

Switching my project to depend on the same eslint as prettier-eslint (specifically, ^4.0.0) solved the problem for me.

Your answer works

My Eslint version is 6.0.1 . It got wrong in vscode .

When I install Eslint 4.0.0 , everything was OK.

@0x80 I honestly wouldn't know. You seem to be working with TS - I'm not. Most probably one of the plugins you're using _do_ require eslint@^6.x Reverting back to latest [email protected] worked for me.

this error happens in windows, in my mac, is fine

@shaodahong Not actually true, I'm afraid. It fails on macOS as well. AFAIK, this is tied to supporting latest eslint. It happens regardless of which OS you are on.

@nfantone sounds bad, hope there fix it

Just ran into this as well so I assume this is about to really hit the fan if not updated soon since I just went through updating eslint across our repos. Luckily google gets here as the top result so it wasn't a time consuming thing to troubleshoot.

Note that with the issue that @0x80 ran into you simply need to reload the VSCode Window (Cmd + Shift + P --> Reload Window)

None of the mentioned solutions do the trick for me.

With [email protected] it couldn't read any plugin, got the error @0x80 mentioned.

With [email protected] it couldn't find ast-utils, got the error @frederikhors

I've managed to get this working again with latest eslint-config-prettier released some hours ago. Here's what I have:

"eslint": "^6.0.1"
"eslint-config-prettier": "^6.0.0"
"eslint-plugin-import": "^2.18.0"
"eslint-plugin-node": "^9.1.0"
"eslint-plugin-prettier": "^3.1.0"
"eslint-plugin-promise": "^4.2.1"
"prettier": "^1.18.2"

I am not using eslint-plugin-node and eslint-plugin-promise, but everything else is the same version:

{
    "eslint": "^6.0.1",
     "eslint-config-prettier": "^6.0.0",
     "eslint-plugin-import": "^2.18.0",
     "eslint-plugin-prettier": "^3.1.0",
}

Still doesn't work.

6/27/2019, 5:43:41 PM:
----------------------
Failed to load plugin 'prettier' declared in 'CLIOptions'/Users/samrith/Work/totem/serverless-graphql/src/handler.js:: Cannot find module 'eslint-plugin-prettier'
Require stack:
- /__placeholder__.js

Setting prettier.eslintIntegration to false works for now.

@samrith-s That looks like an entirely different error to me: Cannot find module 'eslint-plugin-prettier'. I've never seen that one.

Sorry for the brainless question, but are you sure it's declared and installed on serverless-graphql?

I'm positive.
image
This is my go-to setup. I've used it in 50+ projects and it has always worked. Somehow, every single project broke in the last 3-4 days.

@samrith-s Apart from the obvious stuff (try removing the lockfile, rm -rf node_modules/ and yarn or npm i, again), I cannot think of a reason why it wouldn't work for you.

prettier is working as expected in all the projects I've updated so far.

@nfantone I've upgraded all my dependencies to latest, removed node_modules and yarn.lock and reinstalled + restarted vscode.

Still the same ast-utils error for me. This is with versions:

```
"eslint": "^6.0.1",
"eslint-config-prettier": "^6.0.0",
"eslint-plugin-prettier": "^3.1.0",
"eslint-plugin-react": "^7.14.2",
"prettier": "^1.18.2",
````

@nfantone I’ve tried all the possible solutions out there. The only thing that works is disabling prettier.eslintIntegration. I’m almost positive this is an error in prettier-vscode while using enabling ESLint integration.

@nfantone I’ve tried all the possible solutions out there. The only thing that works is disabling prettier.eslintIntegration. I’m almost positive this is an error in prettier-vscode while using enabling ESLint integration.

the same.

863

@acmilank22 @0x80 @samrith-s Strange. Like I said, it did work for me after upgrading - so can't exactly back up the prettier-vscode fault theory.

The only thing that works is disabling prettier.eslintIntegration

Enabling prettier.eslintIntegration makes VSCode use prettier-eslint, instead of prettier binary. Which is something I'm not doing. This might be it, then. And there's actually no real need for using prettier-eslint if you configure your lint rules appropriately.

Another thing I noticed, if you have installed latest version of Node (mine is 12.4.0), it breaks. After downgrading to Node 10, it works as expected.

Enabling prettier.eslintIntegration makes VSCode use prettier-eslint, instead of prettier binary. Which is something I'm not doing. This might be it, then. And there's actually no real need for using prettier-eslint if you configure your lint rules appropriately.

Yes, but it's strange that it's been working with that enabled for so long now, and suddenly in the last 3-4 days, it breaks.

Another thing I noticed, if you have installed latest version of Node (mine is 12.4.0), it breaks.

@samrith-s I was actually going to ask you this (check the "Edit" history on my previous comment!). I'm on LTS.

❯ node -v
v10.16.0

But, anyway, I'd ditch prettier-eslint entirely. Doesn't have much use other than facilitating initial setup - which, if you have been working on 50+ projects in the past like it was mentioned, should not pose a problem.

Yep, ditching it entirely from now on, so that no such problem occurs. Thanks a lot @nfantone for that comment, helped me debug in that direction! 😁

But, anyway, I'd ditch prettier-eslint entirely. Doesn't have much use other than facilitating initial setup

Then I'd need an ESLint config file and a Prettier config file, right? And have to make sure any changes you make to one you have to make to the other, etc.

Also, it seems that ESLint has many settings that are missing from Prettier.

I have to downgrade eslint version because the issue. I hope the solution will come.

Hi,

I'm also having the same issue on mac latest version of Vscode with eslint 6.

Thanks for your help

Same here. Latest version and not even disabling prettier-eslint helped.

Disabling prettier-eslint breaks everything in the code. I'd rather downgrade ESLint version and use Node 10 rather than do that.

@EthanNYT

Then I'd need an ESLint config file and a Prettier config file, right?

No, not really. There are eslint-plugin-prettier and eslint-config-prettier that handle that for you. And prettier doesn't even need one (defaults work well enough). Although, there's nothing preventing you from configuring them separately.

And have to make sure any changes you make to one you have to make to the other, etc.

Plugins above, if kept up to date, will make sure changes in prettier don't mess up with eslint rules and viceversa. And on that same note, once you settle on a set of rules that makes sense for you (or your organisation), you _very rarely_ modify them, in my experience. And not entirely sure what that _"etc."_ would encompass. There's honestly nothing else to it.

Also, it seems that ESLint has many settings that are missing from Prettier.

Those would still apply and won't conflict with each other. What would the issue be here?

Here's my typical eslint + prettier configuration for node projects (I like to use standard + semicolon).

// package.json
{
    "eslint": "^6.0.1",
    "eslint-config-prettier": "^6.0.0",
    "eslint-config-standard": "^12.0.0",
    "eslint-plugin-import": "^2.18.0",
    "eslint-plugin-node": "^9.1.0",
    "eslint-plugin-prettier": "^3.1.0",
    "eslint-plugin-promise": "^4.2.1",
    "eslint-plugin-standard": "^4.0.0",
    "prettier": "^1.18.2"
}
// .eslintrc.json
{
  "extends": [
    "standard",
    "prettier/standard",
    "plugin:prettier/recommended"
  ],
  "parserOptions": {
    "sourceType": "script"
  },
  "env": {
    "node": true,
    "jest": true
  },
  "rules": {
    "semi": [
      2,
      "always"
    ],
    "no-extra-semi": 2,
    "strict": [
      "error",
      "global"
    ]
  }
}
// .prettierrc (can be omitted completely if you're fine with defaults)
{
  "singleQuote": true,
  "printWidth": 100
}

That's all you need. No prettier-eslint, at all.

I‘m new in web front-end. I had same problems and struggled for two days.

With [email protected] it couldn't read any plugin, got the error @0x80 mentioned.
With [email protected] it couldn't find ast-utils, got the error @frederikhors

Now it runs well,emm..., but I don't know why it can run well now.
Maybe my settings can give you some ideas.
I use ts+react
Belows are my configs:

  1. vscode settings
"prettier.eslintIntegration": true 
// Of course it can run well if I set false. But it is not what I want to see.
  1. package.json
// some moudule might be useless...It's just the result of my torment.
"eslint": "5.16.0", // yes, I can run it with `version 5.16.0` now 
"eslint-config-prettier": "^6.0.0",
"eslint-config-react-app": "^4.0.1",
"eslint-plugin-babel": "^5.3.0",
"eslint-plugin-flowtype": "^3.11.1",
"eslint-plugin-import": "^2.18.0",
"eslint-plugin-jsx-a11y": "^6.2.3",
"eslint-plugin-prettier": "^3.1.0",
"eslint-plugin-react": "^7.14.2",
"eslint-plugin-react-hooks": "^1.6.1",
  1. .eslintrc
{
  "parser": "@typescript-eslint/parser",
  "plugins": ["@typescript-eslint", "babel", "flowtype", "prettier", "react"],
  "parserOptions": {
    "sourceType": "module",
    "ecmaFeatures": {
      "modules": true,
      "jsx": true
    },
    "useJSXTextNode": true,
    "project": "./tsconfig.json"
  },
  "extends": [
    "plugin:@typescript-eslint/recommended",
    "plugin:flowtype/recommended",
    "plugin:react/recommended",
    "prettier",
    "prettier/@typescript-eslint",
    "prettier/babel",
    "prettier/flowtype",
    "prettier/react"
  ],
  "rules": {
    // I remember that some rules will infulence the output of prettier in vscode. For example: 
    // I remove "@typescript-eslint/restrict-plus-operands": "error" and one problem disappear
    "@typescript-eslint/explicit-function-return-type": 0,
    "@typescript-eslint/no-explicit-any": 0,
    "@typescript-eslint/no-var-requires": 0,
    "@typescript-eslint/explicit-member-accessibility": 0
  },
  "settings": {
    // it is just to fix an warning in the output of eslint.
    // for file integrality, I paste it.
    "react": {
      "version": "999.999.999"
    }
  }
}

Hope my comment can help.

@nfantone @wangnengjie I like the eslint-plugin-based solutions, seems obvious in hindsight, thanks!

Also @ @wangnengjie

It's just the result of my torment

We've all been there 😁

Also, there is another thing a little strange.
Before I went back to 5.16.0, I try to downgrade eslint version...like 5.14.0, then 5.12.0, and then 5.8.0. Finally 5.4.0 works well.
But when I tried to upgrade, even 5.14.0 can work. Every time I changed the version, I reloaded vscode and make sure that there were no copied versions in node_modules.
But back to 6.0.1 error of this issue occured. Then 5.16.0, another error. But after I remove one of the rules (just I mentioned above). Every thing went well.
I don't even know whether the same problem will occur again tomorrow...QAQ

I had similar problem for a while. I did everything possible. Downgrading and use fix versions. Even copy-paste from other folders/projects that work but didn't work.
Tried empty project with exact packages and it worked but when implement the same in my current project it wouldn't.
But, when Code released the new version, all went back to normal :) I assume MSCode was using some packages that messed up my configs that technically should have the highest priority when loading eslint config.
Anyway, All good and I can work again :)
My current versions: "eslint": "^5.16.0","prettier": "^1.17.0",
MSCode version: 1.36.0

Updating MSCode to 1.36.0 fixed the issue for me too.

@dijam @adriangrahl Is VSCode called MSCode now? Did I miss the memo?

I'm still getting this issue despite following @dijam comment.

my versions and settings are below:

System:
macOS: 10.14.5
Node: 12.6.0
VSCode: 1.36.1

Project Package.json:
"eslint-plugin-react": "^7.14.2",
"eslint": "^5.16.0",
"prettier": "^1.17.0",

VSCode setting:
prettier.eslintIntegration: true

Downgrade eslint to previous working version not helped. I'm getting this issue.

I did a global uninstall and a local uninstall then reinstalled everything locally and now things are working.
```
"eslint": "^6.0.1",
"eslint-config-prettier": "^6.0.0",
"eslint-plugin-import": "^2.18.0",
"eslint-plugin-jsx-a11y": "^6.2.3",
"eslint-plugin-react": "^7.14.2",
"eslint-plugin-react-hooks": "^1.6.1",
"prettier": "^1.18.2"

for vscode how to handle ?

delete eslint Getting better

At the current, my working solution is disable ESlint Integration setting in vscode while waiting for new update version.

[1] Turn off ESlint Integration setting in vscode

[2] Install eslint, eslint-config-google (I'm using config from Google)

     npm i --save-dev eslint eslint-config-google

The newest version will be:

    "eslint": "^6.0.1",
    "eslint-config-google": "^0.13.0"

[3] Configure eslint and prettier to make it work as expected

.eslintrc.json

{
  "extends": ["google"],
  "parserOptions": {
    "ecmaVersion": 2017
  },
  "rules": {
    "object-curly-spacing": ["error", "always"],
    "max-len": ["error", 80],
    "indent": [2, 2, {"SwitchCase": 1}]
  }
}

.prettierrc

{
  "semi": true,
  "trailingComma": "es5",
  "singleQuote": true,
  "printWidth": 80,
  "arrowParens": "always"
}

With this configuration, I got the result as expected before getting error 😄 😄 😄

on
eslint "^5.16.0", "prettier": "^1.18.2"

And it works for me if I delete all modules about eslint and reinstall them

This issue isn't the real issue, this is just a consequence.
The real problem come from prettier-vscode compatibility with ESlint 6...
This topics is becoming a mess a bit more each day and it should be close in favor of #870 !

eslint:
yarn add eslint-plugin-react eslint-plugin-react-native eslint-config-airbnb eslint@^4.19.1 eslint-plugin-import eslint-plugin-jsx-a11y -D

eslint+prettier:
yarn add prettier eslint-config-prettier eslint-plugin-prettier babel-eslint -D

Duplicate of #870

Also, there is another thing a little strange.
Before I went back to 5.16.0, I try to downgrade eslint version...like 5.14.0, then 5.12.0, and then 5.8.0. Finally 5.4.0 works well.
But when I tried to upgrade, even 5.14.0 can work. Every time I changed the version, I reloaded vscode and make sure that there were no copied versions in node_modules.
But back to 6.0.1 error of this issue occured. Then 5.16.0, another error. But after I remove one of the rules (just I mentioned above). Every thing went well.
I don't even know whether the same problem will occur again tomorrow...QAQ

downgrade 5.4.0 . it works !!!

please help

Downgrading to 5.4.0 helped made it work. After that doing a couple of upgrades: to 5.14.0, 5.15.3 and eventually to 5.16.0 all started to work again for some reason \o/ Thank you @Mr-SPM for this tip.

Before that I tried to remove all eslint dependencies and reinstall them, it didn't work. Tried the rm -rf node_modules && npm i treatment, it didn't work. Strange beast, hope it stays working.

Upgrading eslint from 6.1.0 to 6.2.0 fixed the problem for me

Neither ESLint 5.16 or ^6 works. Only 5.4 works for me. For 6.x, there's this error https://github.com/microsoft/vscode-eslint/issues/696

Just so it shows back up at the bottom of the thread: pinning to eslint version ^5.4 fixes this.

yarn upgrade eslint@^5.4

Incase this is still an issue, I found that changing

"prettier.eslintIntegration": true

to

"prettier-eslint.eslintIntegration": true

in Settings (JSON) for VS Code fixed all the issues with prettier and eslint. I've managed to upgrade to the latest version of prettier and eslint and things are working as expected.

Seems "prettier.eslintIntegration" config is now deprecated. there are a deprecation notice and solution in the readme: https://github.com/prettier/prettier-vscode#vscode-eslint-and-tslint-integration

Thanks @mort3za . For the lazy:

Use prettier-eslint instead of prettier. Other settings will only be fallbacks in case they could not be inferred from ESLint rules.

This formats your code via prettier, and then passes the result of that to eslint --fix. This way you can get the benefits of prettier's superior formatting capabilities, but also benefit from the configuration capabilities of eslint.

I had the same weird problem. I use eslint with eslint-plugin-prettier together. Somehow this was colliding with VSCode prettier plugin. After i disabled VSCode prettier plugin and using only eslint it was working again. Also had to set "eslint.autoFixOnSave" to true.

For some reason removing the vs code prettier plugin worked for me

If you are using ESLint to do formatting, another option instead of disabling the plugin would be to disable prettier from formatting the languages you want to be handled by ESLint. You can do this with the by adding a .vscode/settings.json file to your project with the following content:

{
    "prettier.disableLanguages": ["js"]
}

This issue has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

screendriver picture screendriver  ·  4Comments

DanielHabenicht picture DanielHabenicht  ·  4Comments

bluemoehre picture bluemoehre  ·  3Comments

vesper8 picture vesper8  ·  3Comments

PetrykowskiM picture PetrykowskiM  ·  3Comments