prettier-vscode: Unable to resolve custom configuration module

Summary

It seems that version 4.0.0 released a few hours ago breaks importing/using custom Prettier configs. Downgrading to 3.20.0 fixes the issue.

I know 4.0.0 would be a breaking change, but I don’t see anything in the change logs or in the readme that indicates that custom configs would work differently…

Github Repository to Reproduce Issue

https://github.com/greenelab/prettier-config-greenelab

Steps To Reproduce:

  1. Create a new project with npm init
  2. Install this custom Prettier config with yarn add --dev git+https://git@github.com/greenelab/prettier-config-greenelab.git
  3. Create .prettierrc.yaml and put this in it: prettier-config-greenelab
  4. Install the prettier-vscode extension and try to format some javascript code with it

Expected result

The code should format with no errors in the console.

Actual result

The code does not format, and throws errors, as copy-pasted below

Additional information

Feel free to attach a screenshot.

VS Code Version: 1.43.2

Prettier Extension Version: 4.0.0

OS and version: Windows 10 64bit

Prettier Log Output

["INFO" - 11:27:07 AM] Extension Name: "prettier-vscode".
["INFO" - 11:27:07 AM] Extension Version: "4.0.0".
["INFO" - 11:27:07 AM] Enabling prettier for languages
[
  "css",
  "graphql",
  "html",
  "javascript",
  "javascriptreact",
  "json",
  "json5",
  "jsonc",
  "less",
  "markdown",
  "mdx",
  "mongo",
  "postcss",
  "scss",
  "typescript",
  "typescriptreact",
  "vue",
  "yaml"
]
["INFO" - 11:27:07 AM] Enabling prettier for range supported languages
[
  "graphql",
  "javascript",
  "javascriptreact",
  "json",
  "typescript",
  "typescriptreact"
]
["INFO" - 11:27:08 AM] Formatting c:\Users\Vincent\Desktop\adage-frontend\src\pages\signatures\participating\index.js
["ERROR" - 11:27:08 AM] Invalid prettier configuration file detected.
["ERROR" - 11:27:08 AM] Cannot find module 'prettier-config-greenelab' from 'c:\Users\Vincent\Desktop\adage-frontend'
Error: Cannot find module 'prettier-config-greenelab' from 'c:\Users\Vincent\Desktop\adage-frontend'
	at Function.Module._resolveFilename (internal/modules/cjs/loader.js:717:15)
	at Function.n.resolve (c:\Program Files\Microsoft VS Code\resources\app\out\vs\loader.js:15:584)
	at Object.transform (c:\Users\Vincent\.vscode\extensions\esbenp.prettier-vscode-4.0.0\node_modules\prettier\index.js:23283:40)
	at run (c:\Users\Vincent\.vscode\extensions\esbenp.prettier-vscode-4.0.0\node_modules\prettier\third-party.js:11472:51)
	at async cacheWrapper (c:\Users\Vincent\.vscode\extensions\esbenp.prettier-vscode-4.0.0\node_modules\prettier\third-party.js:11300:20)
	at async cacheWrapper (c:\Users\Vincent\.vscode\extensions\esbenp.prettier-vscode-4.0.0\node_modules\prettier\third-party.js:11300:20)
	at async cacheWrapper (c:\Users\Vincent\.vscode\extensions\esbenp.prettier-vscode-4.0.0\node_modules\prettier\third-party.js:11300:20)
	at async cacheWrapper (c:\Users\Vincent\.vscode\extensions\esbenp.prettier-vscode-4.0.0\node_modules\prettier\third-party.js:11300:20)
	at async cacheWrapper (c:\Users\Vincent\.vscode\extensions\esbenp.prettier-vscode-4.0.0\node_modules\prettier\third-party.js:11300:20)
	at async Explorer.search (c:\Users\Vincent\.vscode\extensions\esbenp.prettier-vscode-4.0.0\node_modules\prettier\third-party.js:11457:22)
	at async Promise.all (index 0)

Note that node_modules/prettier-config-greenelab DOES exist in my project. Everything has been installed correctly. I also have a eslint-config-greenelab installed in the same project as well, which works with no problems. And as I said, downgrading prettier-vscode in-situ, while in the same project, works.

About this issue

  • Original URL
  • State: closed
  • Created 4 years ago
  • Reactions: 32
  • Comments: 15 (9 by maintainers)

Most upvoted comments

Issue fixed in version 4.1.1 published which has prettier 2.0.4. Thanks for the rapid fix @thorn0!

@ntotten Prettier 2.0.3 is out.

Prettier config in package.json is broken with new version vscode plugin, but it’s OK with prettier.config.jsconfig below.

1. my prettier config

// ./pacakges/chores/prettier.js

module.exports = {
  printWidth: 100,
  tabWidth: 2,
  useTabs: false,
  semi: true,
  singleQuote: true,
  quoteProps: 'consistent',
  jsxSingleQuote: false,
  trailingComma: 'all',
  bracketSpacing: true,
  jsxBracketSameLine: false,
  arrowParens: 'always',
  rangeStart: 0,
  rangeEnd: Infinity,
  requirePragma: false,
  insertPragma: false,
  proseWrap: 'preserve',
  htmlWhitespaceSensitivity: 'css',
  vueIndentScriptAndStyle: true,
  endOfLine: 'lf',
};

2. prettier key in package.json ❌

{
  "prettier": "./packages/chores/prettier",
}

3. prettier.config.js ✅

module.exports = require('./packages/chores/prettier');

4. error screenshot from vscode

image

@ntotten 2.0.4 is out

@ntotten Please wait a bit more. I’m going to release 2.0.4 because of a severe regression in 2.0.3 (see https://github.com/prettier/prettier/pull/7958).

Turns out it’s an upstream bug or breaking change with Prettier.

A temporary fix per @ntotten is to change your .prettierrc.yaml to prettier: prettier-config-yourcustomlib instead of just prettier-config-yourcustomlib.

Hmmm… Can you post an issue on Prettier directly?! I’m not aware of this change…