microsoft/vscode-vsce

Support pnpm

muuvmuuv opened this issue · 33 comments

I tried publishing my extension but recently switched to use pnpm instead of npm. vsce seems to not support this package manager (does yarn even works, very similar to pnpm) since it tries to do npm list --production --parseable --depth=99999 which fails in pnpm projects because of the different handling of dependencies.

Project: https://github.com/muuvmuuv/vscode-sundial

Error:

❯ npm list --production --parseable --depth=99999
/Users/marvinheilemann/Development/VSCode/vscode-sundial
/Users/marvinheilemann/Development/VSCode/vscode-sundial/node_modules/dayjs
/Users/marvinheilemann/Development/VSCode/vscode-sundial/node_modules/got
/Users/marvinheilemann/Development/VSCode/vscode-sundial/node_modules/public-ip
/Users/marvinheilemann/Development/VSCode/vscode-sundial/node_modules/suncalc
npm ERR! missing: @sindresorhus/is@^1.0.0, required by got@10.5.5
npm ERR! missing: @szmarczak/http-timer@^4.0.0, required by got@10.5.5
npm ERR! missing: @types/cacheable-request@^6.0.1, required by got@10.5.5
npm ERR! missing: cacheable-lookup@^2.0.0, required by got@10.5.5
npm ERR! missing: cacheable-request@^7.0.1, required by got@10.5.5
npm ERR! missing: decompress-response@^5.0.0, required by got@10.5.5
npm ERR! missing: duplexer3@^0.1.4, required by got@10.5.5
npm ERR! missing: get-stream@^5.0.0, required by got@10.5.5
npm ERR! missing: lowercase-keys@^2.0.0, required by got@10.5.5
npm ERR! missing: mimic-response@^2.0.0, required by got@10.5.5
npm ERR! missing: p-cancelable@^2.0.0, required by got@10.5.5
npm ERR! missing: p-event@^4.0.0, required by got@10.5.5
npm ERR! missing: responselike@^2.0.0, required by got@10.5.5
npm ERR! missing: to-readable-stream@^2.0.0, required by got@10.5.5
npm ERR! missing: type-fest@^0.9.0, required by got@10.5.5
npm ERR! missing: dns-socket@^4.2.0, required by public-ip@4.0.0
npm ERR! missing: got@^9.6.0, required by public-ip@4.0.0
npm ERR! missing: is-ip@^3.1.0, required by public-ip@4.0.0

Equivalent command would be: pnpm list --prod --json (yarn uses the same)

I guess this requires some rework of the npm.ts script. There is a package that checks which pm was used, maybe something to consider: https://github.com/zkochan/packages/tree/master/which-pm

I've been looking at how to make this work. The main issue is that pnpm makes heavy use of symlinks which won't work with the vsix compression, which is just PKZIP.

I've been able to get it to fully work with pnpm install --shamefully-hoist, but that seems less than ideal.

Having this problem too. I don't want to mix many package managers in a single project

I just ended up using yarn for my vscode extension, while using pnpm for everything else. Hopefully this will be solved soon.

vsce should be package manager agnostic. Having it using npm instead of using whatever the dev has is far from ideal. I had to use npm when I use pnpm for everything else:

pnpm i
vsce publish # error

npm ci
vsce publish #works

This worked on previous versions of vsce, so the change mush be kinda recent.

Oh... I just forgot about my issue about that last year and switched to pnpm again with the same extension xD

Can this get more attention please, since Node allows to have any pm to be the default: https://pnpm.io/installation#nodejs-is-preinstalled

I really don't want to use npm just for one project which would also mean I must remove my alias npm=pnpm line in zshrc :D

+1

Use pnpm occur problem:

0 verbose cli [
0 verbose cli   '/Users/yutengjing/.nvm/versions/node/v14.18.0/bin/node',
0 verbose cli   '/Users/yutengjing/.nvm/versions/node/v14.18.0/bin/npm',
0 verbose cli   'list',
0 verbose cli   '--production',
0 verbose cli   '--parseable',
0 verbose cli   '--depth=99999',
0 verbose cli   '--loglevel=error'
0 verbose cli ]
1 info using npm@7.24.1
2 info using node@v14.18.0
3 timing npm:load:whichnode Completed in 0ms
4 timing config:load:defaults Completed in 1ms
5 timing config:load:file:/Users/yutengjing/.nvm/versions/node/v14.18.0/lib/node_modules/npm/npmrc Completed in 2ms
6 timing config:load:builtin Completed in 2ms
7 verbose config production Use `--omit=dev` instead.
8 timing config:load:cli Completed in 2ms
9 timing config:load:env Completed in 1ms
10 timing config:load:file:/Users/yutengjing/code/vscode-fe-helper/.npmrc Completed in 0ms
11 timing config:load:project Completed in 0ms
12 timing config:load:file:/Users/yutengjing/.npmrc Completed in 3ms
13 timing config:load:user Completed in 3ms
14 timing config:load:file:/Users/yutengjing/.nvm/versions/node/v14.18.0/etc/npmrc Completed in 0ms
15 timing config:load:global Completed in 0ms
16 timing config:load:validate Completed in 1ms
17 timing config:load:credentials Completed in 1ms
18 timing config:load:setEnvs Completed in 0ms
19 timing config:load Completed in 11ms
20 timing npm:load:configload Completed in 11ms
21 timing npm:load:setTitle Completed in 15ms
22 timing npm:load:setupLog Completed in 1ms
23 timing config:load:flatten Completed in 2ms
24 timing npm:load:cleanupLog Completed in 1ms
25 timing npm:load:configScope Completed in 0ms
26 timing npm:load:projectScope Completed in 1ms
27 timing npm:load Completed in 31ms
28 timing arborist:ctor Completed in 2ms
29 timing command:ls Completed in 1547ms
30 verbose stack : @eslint/eslintrc@0.4.3 /Users/yutengjing/code/vscode-fe-helper/node_modules/@eslint/eslintrc
30 verbose stack extraneous: @types/color-name@1.1.1 /Users/yutengjing/code/vscode-fe-helper/node_modules/@types/color-name
30 verbose stack extraneous: @types/eslint-scope@3.7.1 /Users/yutengjing/code/vscode-fe-helper/node_modules/@types/eslint-scope
30 verbose stack extraneous: @types/json-schema@7.0.9 /Users/yutengjing/code/vscode-fe-helper/node_modules/@types/json-schema
30 verbose stack extraneous: @types/json5@0.0.29 /Users/yutengjing/code/vscode-fe-helper/node_modules/@types/json5
30 verbose stack extraneous: @types/normalize-package-data@2.4.1 /Users/yutengjing/code/vscode-fe-helper/node_modules/@types/normalize-package-data
30 verbose stack extraneous: @types/parse-json@4.0.0 /Users/yutengjing/code/vscode-fe-helper/node_modules/@types/parse-json
30 verbose stack extraneous: @types/source-list-map@0.1.2 /Users/yutengjing/code/vscode-fe-helper/node_modules/@types/source-list-map
30 verbose stack extraneous: @types/tapable@1.0.8 /Users/yutengjing/code/vscode-fe-helper/node_modules/@types/tapable
30 verbose stack extraneous: @types/webpack-sources@3.2.0 /Users/yutengjing/code/vscode-fe-helper/node_modules/@types/webpack-sources
30 verbose stack extraneous: @types/yargs-parser@20.2.1 /Users/yutengjing/code/vscode-fe-helper/node_modules/@types/yargs-parser
30 verbose stack extraneous: @typescript-eslint/scope-manager@4.33.0 /Users/yutengjing/code/vscode-fe-helper/node_modules/@typescript-eslint/scope-manager
30 verbose stack extraneous: @typescript-eslint/types@4.33.0 /Users/yutengjing/code/vscode-fe-helper/node_modules/@typescript-eslint/types
30 verbose stack extraneous: @typescript-eslint/visitor-keys@4.33.0 /Users/yutengjing/code/vscode-fe-helper/node_modules/@typescript-eslint/visitor-keys
30 verbose stack extraneous: ast-types@0.14.2 /Users/yutengjing/code/vscode-fe-helper/node_modules/ast-types
30 verbose stack extraneous: eslint-module-utils@2.6.2 /Users/yutengjing/code/vscode-fe-helper/node_modules/eslint-module-utils
30 verbose stack extraneous: eslint-scope@5.1.1 /Users/yutengjing/code/vscode-fe-helper/node_modules/eslint-scope

vsce should be package manager agnostic. Having it using npm instead of using whatever the dev has is far from idea

In the longterm it should probably use corepack, which was designed for this case:

Corepack is a zero-runtime-dependency Node.js script that acts as a bridge between Node.js projects and the package managers they are intended to be used with during development. In practical terms, Corepack will let you use Yarn and pnpm without having to install them - just like what currently happens with npm, which is shipped by Node.js by default.

via nodejs/corepack

Below solution works for me:

  1. bundle extension, see https://code.visualstudio.com/api/working-with-extensions/bundling-extension
// this is my package.json
"scripts": {
    "vscode:prepublish": "npm run esbuild-base -- --minify",
    "esbuild-base": "esbuild ./src/extension.ts --bundle --outfile=out/main.js --external:vscode --format=cjs --platform=node"
}
  1. add --no-dependencies option to vsce package and vsce publish command(because you already bundled your extension, then there is no need to include npm dependencies when package and publish, all things is in your bundle)
// this is my package.json
"scripts": {
    "package": "pnpm vsce package --no-dependencies",
    "publish": "pnpm vsce publish --no-dependencies"
}

Source: https://zenn.dev/mkizka/articles/a60fcfcf606768

@F3n67u done, thank you!

If someone need to reference:

Thanks @F3n67u
When vsce package --no-dependencies is specified, it doesn't include node_modules even without any .vscodeignore file. Is this expected? Is node_modules not required to be packages into the vsix when esbuild is used?

Thanks @F3n67u
When vsce package --no-dependencies is specified, it doesn't include node_modules even without any .vscodeignore file. Is this expected? Is node_modules not required to be packages into the vsix when esbuild is used?

@mohanraj-r yes. It's expected. when you bundle your extension then node_moudle is not needed.

just encountered the same issues with pnpm. really thought something huge like vscodee/ vsce cli supports all package managers.

Same here -- is pnpm support on the product roadmap?

Just under three years and this hasn't gotten any attention from Microsoft. This is the problem with a bigcorp owning the product.

Note that the solution posted by @F3n67u will work in many cases but not all. ESBuild has a notoriously difficult time with dynamic require, which packages like prismajs make use of.

Update: Using the following configuration in .npmrc seems to have worked:

# pnpm options
enable-pre-post-scripts = true
node-linker=hoisted
shamefully-hoist = true

The node-linker is the key. While there are still some speed advantages using pnpm, it is measurably slower than the default linker.

It is crazy that this still doesn't work.

If you make a VSCode Extension using Microsoft's own suggested generator-code and set it to pnpm, vsce package just straight-up doesn't work.

Why is that even an option if this doesn't actually work?

They really need to fix this. Now I have to restructure my project to use npm instead :(

Just under three years and this hasn't gotten any attention from Microsoft. This is the problem with a bigcorp owning the product.

@shellscape Yes, and de facto forcing it on everyone, after buying out GitHub, and subsequently killing Atom (after promising not to 🤥)… Ran into this latest hurdle, having to port over my dozen or so packages… 😠

i wonder why they support it in code generator but not the package tool

Closing this as out of scope. As part of our recurring maintenance milestone, we've decided to limit the amount of supported package managers to npm and yarn v1 only.

Note that there are known workarounds.

Hilariously out of touch with the ecosystem. Well done, folks.

Here's a better workaround, accounting for runtime dependencies, that worked for me.

bad. sad as a pnpm fan. pnpm has some useful features like preventing phantom dependencies. limiting to npm and yarn 1 (even no yarn 2+?) is short-sighted. leave this issue open is better than telling everyone "this never gonna happen"

this is still an issue? Well I guess workarounds will have to do

This is still and issue? Sucks that I'd have to stick to npm for vscode extensions

@okay-head I switched to Zed a while back. vscode is run by corporate Microsoft managers, not the actual users.

@shellscape Zed is only available for Mac

How about vscodium? Is it any good

And Linux. you can do more customizing with vscodium and it doesn't track you, so it's a better alternative than vecode, but it's still vscode at the core.

yg-i commented

Isn't pnpm explicitly listed as one of the package manager options in the official vscode extension generator (yo code)?

I picked the pnpm option and haven't made any changes to any of the config files. I'm able to run and debug my extension with no problem but when I try to package it, I see this wall of errors:

Try this:

pnpm vsce publish --no-dependencies