Lernajs/yarn workspaces with an aurelia application

41

@timfish I am using the below command for my webpack projects. It ensures the deps finish prior to webpack running. It’s a much faster startup for my larger projects. Prior I’d see webpack recompile multiple times depending on when other packages finished their build.

yarn wsrun -p <my-package> --stages --done-criteria=\"Found 0 errors. Watching for file changes.\" -r watch

If you don’t care about a package not completing with no errors then removing the Found 0 errors from the done criteria will allow that.

2 Likes
42

Thanks @elitemike that looks useful!

1 Like
43

hey guys just to add some more tech news info to this post…

Apparently NPM 7-8 will make Lerna obsolete (someone mentioned that in an Lerna issue, which I can’t find anymore, they were saying there’s barely any development on Lerna for the past year and the reason might be because NPM is coming with this feature with NPM 7 or 8).

You can read about NPM 7 and Workspace from their blog post
npm CLI Roadmap - Summer 2019](npm Blog Archive: npm CLI Roadmap - Summer 2019)

Workspaces
First-class support for symbolic links means that workspaces will be trivial to implement. npm v7 will have at least the Workspace feature support of Yarn, and will set the stage for more advanced workspace features in v8.

At minimum, you’ll be able to keep multiple related packages all together in a single repository, and test changes in an integrated environment, without continually re-linking.

Once Workspaces land, it’ll be possible to add more advanced workspace management features. For example, building, versioning, managing permissions, and publishing all the packages within a workspace together with a single command. That likely won’t be in 7.0, and may be pushed out until v8, depending on feedback and user demand.

It looks like NPM 7 is about to go RC in the next few weeks (currently at Beta 13) and will be out by year end, while NPM 8 is planned for next year or so. Also if I understand correctly, NPM 7 will be on par with Yarn Workspaces and perhaps the Lerna features would be in NPM 8?!?

There’s also this RFC - npm workspaces which has a lot more info. It looks nearly the same as Yarn Workspaces from what I can see.

Why do I have this feeling that whatever I learn today becomes obsolete not long after… can’t keep up lol

3 Likes
44

can’t keep up lol

Well, you are humble. You have been keeping up with it for probably a decade at least? :smile:

1 Like
45

haha yeah something like that :laughing:

1 Like
46

It’s going to be interesting to see where NPM leaves yarn. I thought yarn 2 was going to be the future but maybe npm can eventually get everything right without the extra help. Either way, I have a “working” mono repo right now and must just focus on what my customer cares about.

2 Likes
47

I like yarn because I can type yarn build rather than yarn run build.

When is npm going to allow me to drop the run word? :rofl:

1 Like
48

Now if only I can get Visual studio code debugging to hit breakpoints all would be well

1 Like
49

Wow thanks for the tip, I didn’t even know we could omit the run keyword with Yarn.

1 Like
50

It was a bit challenging to get the breakpoints to work in all Lerna packages but after lots of trials and errors, I got it working in all my packages and my demo which is outside of the Lerna packages folder.

I had to do lots of changes but eventually found that this is what works in my Lerna setup

{
  "version": "0.2.0",
  "configurations": [
    {
      "name": "Chrome Debugger",
      "type": "chrome",
      "request": "launch",
      "breakOnLoad": false,
      "url": "http://localhost:8888",
      "webRoot": "${workspaceRoot}",
      "trace": true,
      "sourceMapPathOverrides": {
        "webpack:///${workspaceRoot}/packages/*": "${webRoot}/packages/*",
        "webpack:///./src/*": "${webRoot}/examples/webpack-demo-vanilla-bundle/src/*"
      }
    },
}

which you can see in this launch.json file.

So this works for my project with this structure

  • /examples/webpack-demo
  • /packages/*

Visiting the VSCode Chrome Debugger Extension GitHub sourcemaps readme helped me a lot.

3 Likes