Yarn 2 PnP Compatibility

bohushvitali commented 3 years ago

Available workarounds for adding Yarn 2 PnP compatibility seams like doesn't work in workspace created using yarn.build. Will be nice to find alternative to extraction of volar.vsix in vue-tsc

➤ YN0000: ┌ Run build for packages/volar-starter
➤ YN0009: │ ┌ [stderr] packages/volar-starter
➤ YN0009: │ │ events.js:292
➤ YN0009: │ │       throw er; // Unhandled 'error' event
➤ YN0009: │ │       ^
➤ YN0009: │ │ Error: EROFS: read-only filesystem, mkdir '/node_modules/vue-tsc/volar'

running yarn unplug vue-tsc in packages/volar-starter resulting in:

➤ YN0009: │ │ Error: vue-tsc tried to access vscode-languageserver, but it isn't declared in its dependencies; this makes the require call ambiguous and unsound.
➤ YN0009: │ │ Required package: vscode-languageserver (via "vscode-languageserver/node")
➤ YN0009: │ │ Required by: vue-tsc@npm:0.0.14

adding to .yarnrc.yml

packageExtensions:
  "vue-tsc@*":
    dependencies:
      "vscode-languageserver": "*"
      "vscode-css-languageservice": "*"
      "vscode-html-languageservice": "*"
      "@vue/shared": "*"

resulting in:

➤ YN0009: │ │ Error: vue-tsc tried to access @volar/vscode-pug-languageservice, but it isn't declared in its dependencies; this makes the require call ambiguous and unsound.
➤ YN0009: │ │ Required package: @volar/vscode-pug-languageservice (via "@volar/vscode-pug-languageservice")
➤ YN0009: │ │ Required by: vue-tsc@npm:0.0.14

@volar/vscode-pug-languageservice isn't published on npm and Yarn cannot resolve it from .yarn/unplugged/vue-tsc-npm-0.0.14-*/node_modules/vue-tsc/volar/extension/node_modules

johnsoncodehk commented 3 years ago

I will publish volar to npm when api stable, thanks for the report!

rseeberg commented 3 years ago

if you really want this to work right now @bohushvitali then it is possible. This is what worked for me:

.yarnrc.yml

packageExtensions: "vue-tsc@*": dependencies: "@volar/html2pug": "*" "jsonc-parser": "*" "pug-beautify": "*" "htmlparser2": "*" "upath": "*" "@vue/compiler-dom": "*" "@vue/reactivity": "*" "@starptech/prettyhtml": "*" "vscode-languageserver-textdocument": "*" "vscode-emmet-helper": "*" "@volar/source-map": "*" "vscode-languageserver-types": "*" "@volar/shared": "*" "@volar/vscode-typescript-languageservice": "*" "vscode-languageserver": "*" "vscode-css-languageservice": "*" "vscode-html-languageservice": "*" "@vue/shared": "*" "@volar/vscode-pug-languageservice": "*" "@volar/vscode-pug-languageservice@*": dependencies: "vscode-languageserver-textdocument": "*" "@volar/source-map": "*" "@volar/shared": "*" "upath": "*" "vscode-html-languageservice": "*" "@volar/shared@*": dependencies: "vscode-uri": "*" "@volar/source-map@*": dependencies: "vscode-languageserver": "*" "@volar/shared": "*" "@volar/vscode-typescript-languageservice@*": dependencies: "@volar/shared": "*" "upath": "*"

  package.json

  `"resolutions": {
    "@volar/vscode-pug-languageservice": "file:volar/vscode-pug-languageservice",
    "vscode-languageserver-textdocument": "file:volar/vscode-languageserver-textdocument",
    "@volar/shared": "file:volar/shared",
    "vscode-uri": "file:volar/vscode-uri",
    "@volar/source-map": "file:volar/source-map",
    "@volar/html2pug": "file:volar/html2pug",
    "vscode-languageserver": "file:volar/vscode-languageserver",
    "vscode-html-languageservice": "file:volar/vscode-html-languageservice",
    "@volar/vscode-typescript-languageservice": "file:volar/vscode-typescript-languageservice",
    "vscode-languageserver-types": "file:volar/vscode-languageserver-types",
    "vscode-emmet-helper": "file:volar/vscode-emmet-helper"
}`

in the folder containing your package.json, you create a new folder (i called it volar),
and you start to copy all of these things into it.
The easier way to get these individual packages is to unzip the `volar.vsix` file that you can find inside vue-tsc

I did this purely to find out if vue-tsc actually had support for `--watch` (spoiler alert, it does not), but i really would not recommend going down this route. It's messy, probably conflicts with a ton of licenses, and what you end up with is the same as you can get using `vti diagnostics` (see https://vuejs.github.io/vetur/guide/vti.html)

johnsoncodehk commented 3 years ago

@rseeberg Thanks for your shared! Watch mode is not support yet, see:

johnsoncodehk / vue-tsc

Yarn 2 PnP Compatibility #5