Evaluate yarn and yarn-workspaces and check if it can be used instead of npm and npm-workspaces in Lume

[govind-srinidhi]

Feature description

There is a requirement for us to make Lume work for both Vue 2 and 3. In order to test the functionalities in both the version, we need to have two instances of storybook one to verify all the components in Vue 2 and the other for Vue 3.

We recently noticed an issue with nohoist not available in npm. nohoist allows us to skip sharing the same package between the workspaces.

Storybook for Vue 2 has a dependency of one version of vue-vite package and Vue 3's storybook needs a different dependency of vue-vite.

With the existing hoisting algorithm, npm is picking the shared version of vue-vite always rather than the Vue 2 or 3 specific workspace's vue-vite. This can be easily solved with nohoist feature that's available in other package managers like yarn and pnpm.

Goal of this task is to:

• Figure out if npm and npm workspaces can still be used by mimicking the nohoist feature ourselves. Maybe something like this?
• Check if yarn and yarn workspaces can be used instead of npm/npm workspaces in Lume. Yarn comes up with the nohoist feature by default. That could solve the problem, and since it's a widely used package manager worth checking out

Problem/motivation

No response

Describe alternatives you've considered

No response

Additional context

No response

Validations

• Follow our Code of Conduct
• Read the Contributing Guidelines.
• Check that there isn't already an issue that request the same feature to avoid creating a duplicate.

[govind-srinidhi]

Tried to make the current setup work with NPM before starting with YARN experimentation:

Here are the observations:

• Installed the desired version of @storybook/vue-vite in the root under packages/node_modules.
• Storybook for Vue 2 was able to pick up the vue-vite and the storybook page was accessible for Vue 2.
• But when we tried to interact with the stories, it used to fail for Vue 2 version. The reason being there are other packages we need to take care of:
  @storybook/manager-api, @storybook/addon-a11y and @storybook/cli
• Since these package names are same for Vue 2/3, we need to create an alias in the root folder to make this accessible.

This is more of a maintenance hell, if we need to mimick nohoist feature every time we have to interact with new package. Makes this one of the primary reason to go away with NPM and start considering YARN or PNPM.