node modules - Prettier plugin not resolved when using GitHub package with pnpm, but works with npm - Stack Overflow

admin管理员组

文章数量:1410712

I’ve got a GitHub package for my Prettier config that I use across a bunch of my projects. The config uses a plugin, and when I install the package using pnpm, it puts the plugin inside the .pnpm folder in node_modules, but then Prettier throws an error saying it can’t find the plugin.

Weird thing is — when I install it with npm, everything works just fine.

Here’s what my Prettier config file looks like:

/**
 * @see 
 * @type {import("prettier").Config}
 */
module.exports = {
  tabWidth: 4,
  semi: false,
  singleQuote: true,
  importOrder: [
    '^react|^react-dom',
    '<THIRD_PARTY_MODULES>',
    '^@core/(.*)$',
    '^@server/(.*)$',
    '^@ui/(.*)$',
    '^[./]',
    '<TYPES>',
  ],
  importOrderSortSpecifiers: true,
  importOrderMergeDuplicateImports: true,
  plugins: ['@ianvs/prettier-plugin-sort-imports'],
}

I’ve tried installing the plugin both as a dependency and a devDependency in the package, but no luck either way.

Any idea how to fix this?

I’ve got a GitHub package for my Prettier config that I use across a bunch of my projects. The config uses a plugin, and when I install the package using pnpm, it puts the plugin inside the .pnpm folder in node_modules, but then Prettier throws an error saying it can’t find the plugin.

Weird thing is — when I install it with npm, everything works just fine.

Here’s what my Prettier config file looks like:

/**
 * @see https://prettier.io/docs/configuration
 * @type {import("prettier").Config}
 */
module.exports = {
  tabWidth: 4,
  semi: false,
  singleQuote: true,
  importOrder: [
    '^react|^react-dom',
    '<THIRD_PARTY_MODULES>',
    '^@core/(.*)$',
    '^@server/(.*)$',
    '^@ui/(.*)$',
    '^[./]',
    '<TYPES>',
  ],
  importOrderSortSpecifiers: true,
  importOrderMergeDuplicateImports: true,
  plugins: ['@ianvs/prettier-plugin-sort-imports'],
}

I’ve tried installing the plugin both as a dependency and a devDependency in the package, but no luck either way.

Any idea how to fix this?

• npm
• node-modules
• prettier
• pnpm
• github-packages

Share Follow asked Mar 9 at 18:47 HamidrezaHamidreza 1,5651313 silver badges2020 bronze badges

Add a comment  | 

1 Answer 1

Sorted by: Reset to default 0

The problem is that pnpm uses a strict link structure with the .pnpm directory, and Prettier has problems resolving plugins like this. But when you install with npm, it creates a basic flat node_modules structure, which Prettier can navigate more easily.
I can think in two options for you:

Option 1:
Use pnpm's packageExtensions feature

Add this to your package.json:

"pnpm": {
"packageExtensions": {
"prettier": {
"dependencies": {
"@ianvs/prettier-plugin-sort-imports": "*"
}
}
}
}

This tells pnpm that Prettier depends on your import plugin

Or option 2:

Use:

shamefully-hoist=true

Modify your .npmrc file to make pnpm's dependency resolution more compatible with Prettier. This will make pnpm hoist all dependencies to the root of node_modules, almost like npm, see if it works!!

本文标签：