question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

failed to load prettier from package.json

See original GitHub issue

Summary

I receive an error when I open package.json file from VS Code

Steps To Reproduce:

  1. Open package.json with Prettier extension enabled
  2. Add these to settings.json:
"prettier.configPath": "/home/v1rtl/.prettierrc.yml",
"editor.defaultFormatter": "esbenp.prettier-vscode",

and create ~/.prettierrc.yml:

printWidth: 80
semi: false
singleQuote: true
useTabs: false

Expected result

I would open package.json with no errors

Actual result

It dropped this error:

Failed to load module. Attempted to load prettier from package.json.

Also in logs I saw this:

[INFO - 1:36:27 PM] Failed to load prettier from .

Additional information

VS Code Version: 1.40.0

Prettier & Prettier Plugin Version: 3.6.0

OS and version: Manjaro, Linux 4.19.84

Issue Analytics

  • State:closed
  • Created 4 years ago
  • Reactions:17
  • Comments:37 (15 by maintainers)

github_iconTop GitHub Comments

5reactions
tunjioyecommented, Nov 19, 2019

The Failed to load module. Attempted to load prettier from package.json. error notification started after updating to VS Code to version 1.40.1.

For now, you can solve it by setting Prettier Path in your VS Code Settings.


https://stackoverflow.com/questions/58866847/in-vs-code-im-getting-this-error-failed-to-load-module-attempted-to-load-pr/58934707#58934707

1. Install Prettier Globally via npm if you have never installed it globally

npm i prettier -g

2. Search & Use the Prettier Path Extension Settings in your VS Code Settings

enter image description here

// You can navigate to VS Code Settings > Extensions > Prettier for all Prettier Extension Settings

3. Update the Prettier Path to your globally installed Prettier.

For Example

/usr/local/lib/node_modules/prettier (Mac OS)

\AppData\Roaming\npm\node_modules\prettier (Windows)

3reactions
ntottencommented, Nov 21, 2019

There seem to be a few different issues going on here.

  1. Prettier must be included in the package.json. Not just installed in the node_modules, but listed in the package.json. This is something I may change later, but that is the behavior now.

  2. In one of the logs provided I am seeing this error [ERROR - 8:10:32 AM] Outdated version of prettier installed. Falling back to bundled version of prettier. You need to make sure you are using prettier version 1.13 or above otherwise it will fallback to the bundled prettier.

  3. Global modules aren’t supported yet and never have been. This is also something we might change, but its not supported. As others have noted, you can make them work by setting the path to the global module in the Prettier Path setting.

Read more comments on GitHub >

github_iconTop Results From Across the Web

In VS Code, I'm getting this error, 'Failed to load module ...
Open VSCode and type cmd + shift + p to open the Command Palette. · Type Prettier: Reset Module Execution State · Then...
Read more >
Failed to load module. Attempted to load prettier from package ...
If you have prettier or plugins referenced in package.json, ensure you have runnpm installAttempted to load prettier from package.json.” and the ...
Read more >
Cannot find module 'prettier' error | bobbyhadz
To solve the error "Cannot find module 'prettier'", make sure to install the prettier package by opening your terminal in your project's root...
Read more >
Prettier not working in VS code - Salesforce Stack Exchange
Installed Prettier and selected Prettier as the 'Default Formatter' for both User and Workspace. Installed node js. Ran the command npm install.
Read more >
Configuration File - Prettier
This means you can configure Prettier via (in order of precedence):. A "prettier" key in your package.json file. A .prettierrc file written in...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found