Issues when running with npm workspaces

[renestalder]

I am using Pattern Lab Node v5.15.0 on Linux, with Node v16.x.x, using a Twig Edition.

When using npm workspaces and try to run patternlab from the root project of the monorepo, Pattern Lab has problems to either resolve files or dependencies.

If somebody has more knowledge about the underlying logic that resolves the files here and can point out why this might happen, I could probably provide the fix.

Expected Behavior

Pattern Lab shouldn't make a difference in path resolving from whether it runs in the current folder or via workspaces.

Actual Behavior

[watch] build finished, watching for changes...
 (node:428811) [DEP0128] DeprecationWarning: Invalid 'main' field in '/Projects/my-company/code/my-website/node_modules/emitter-mixin/package.json' of 'y'. Please either fix that or report it to the module author
 (Use `node --trace-deprecation ...` to show where the warning was created)
 ⊙ patternlab → serve: Serving your files ...
 Pattern Lab Node v5.15.0
 No engines loaded! Something is seriously wrong.
 TypeError: Cannot read property 'findListItems' of undefined
     at Pattern.findListItems (/Projects/my-company/code/my-website/node_modules/@pattern-lab/core/src/lib/object_factory.js:277:24)
     at processListItemPartials (/Projects/my-company/code/my-website/node_modules/@pattern-lab/core/src/lib/list_item_hunter.js:8:29)
     at Object.process_list_item_partials (/Projects/my-company/code/my-website/node_modules/@pattern-lab/core/src/lib/list_item_hunter.js:43:14)
     at module.exports (/Projects/my-company/code/my-website/node_modules/@pattern-lab/core/src/lib/decompose.js:26:44)
     at module.exports (/Projects/my-company/code/my-website/node_modules/@pattern-lab/core/src/lib/processMetaPattern.js:18:10)
     at /Projects/my-company/code/my-website/node_modules/@pattern-lab/core/src/lib/buildPatterns.js:96:40
     at async Object.build (/Projects/my-company/code/my-website/node_modules/@pattern-lab/core/src/index.js:134:14)
 Error processing patterns recursively
 where is the engine?
 error during header render()
 where is the engine?
 error during footer render()
 where is the engine?
 error during buildFrontend()
 npm run serve:patternlab exited with code 0

Steps to Reproduce

1. Create a npm project with workspaces e.g. package.json in root contains:

  {
       "workspaces": [
         "./packages/*"
       ],
   }

2. Init patterlab in packages/patternlab
3. Install dependencies by running npm i in the root
4. Run build or a watch command from root npm run build --workspaces

[mfranzke]

@renestalder thanks a lot for your feedback.

I sadly don't have any experience with npm workspaces so far. It probably mainly matters on how step 2 of your list is being handled:

From my understanding by the description on the npm documentations page for handling installations within workspace packages, these installations should be done by the following (example) command:
npm install abbrev -w a

Adapted to our case, it would be the installation of patternlab by this command:
npm create pattern-lab -w packages/patternlab

This leads to that we could even also skip 3, as the installation is done within the package.

Running npm run build --workspaces afterwards works fine than.

I've prepared a test setup for that, see below.

Important comment on Node 16 usage:
Due to the problem described within the issue #1348, we would need to wait until that solution got merged for an easy installation. I've created some files for a comparable setup within the repo https://github.com/mfranzke/playground (it mainly contains the quick fix by having the no-emit-webpack-plugin dependency even already listed with its version 2 within the workspaces package, which we won't need after that previous mentioned solution got merged).

After running the following command everything works fine and the build correctly proceeds (if you want to test that out easily, I recommend https://gitpod.io/#https://github.com/mfranzke/playground):
nvm install node && nvm use node && npm create pattern-lab -w packages/patternlab && npm run pl:build --workspaces
(we only need the nvm install node && nvm use node at the beginning on environments that don‘t have node 16 already installed.)

[renestalder]

@mfranzke Thanks for taking this on a run.

It indeed works the way you describe. Yet, once you remove packages/patternlab/node_modules and run npm install again from the root folder, then try to build again with npm run build --workspaces, you run in the same problem as described above.

I also tried the whole thing with pnpm, as pnpm is better in handling workspaces in general, but it runs into the same issue.

I assume there is some part in patternlab that doesn't resolve paths correctly or makes an assumption that node_modules always is installed the same way in the patternlab folder. Because currently I can't replicate the problem with other dependencies and projects.

Not that I would have to explain that :) as this repository here is a monorepo itself, but workspace installations will often bundle all node_modules in the root folder instead of the package folders themselves and I guess this, plus maybe some wrong context handling during build might lead to the error.

[mfranzke]

Thanks a lot for your further feedback, @renestalder. I've found out that the logic for resolving the path to engines directories has been implemented long before npm workspaces got introduced (actually with commit 416132c in mid 2016), so we would need to refactor this implementation. I'll provide a PR.