Lerna, what's the opposite of 'yarn run lerna add component-a' - yarnpkg

With Lerna to add a package to all other package file I can use -
yarn run lerna add component-a
With this I see the item added to all package files in my overall repo.
If I use
yarn run lerna clean component-a
the output suggests its remove the component from the node_modules but it still exists inside the package files that were added via the add command.
So what will reverse the add command fully.

Related

Yarn & Monorepo: Prevent using local packages

I have a yarn/lerna monorepo with multiple packages that depend on each other. If I add packageA as a dependency to packageB and execute yarn install I see that node_modules/packageA is actually a symlink to packages/packageA instead of the published version of that package.
This creates problems on CI if packageB is build before packageA - the build fails because node_modules/packageA just points to the bare sources, without the build products (because packageA has not yet been built).
How can I force yarn to always download the published version of packageA?
yarn --version: 1.22.10
sidenote: If I wanted to use a local version of packageA instead, I would use yarn link or a local path instead of a version in package.json. Why is yarn defaulting to this behaviour?
One options is: "focussed workspaces" - see the guide here.
In my case, I added a file packages/packageB/.yarnrc that specifies to always use the --focus argument for yarn install:
--install.focus true
This will make sure that packageB has a copy of the published packageA in it's own node_modules folder.
However: This only works for one package at a time.
You can just build packages in order of dependencies. So in your case it'd be something like this in your CI (assuming there is a script entry called "build" in package.json of the packages):
yarn workspace packageA run build
yarn workspace packageB run build
This way you control the order of builds,they complete successfully, and you don't have to force using published package.

How do I install vuetify directly from github?

When I try with
npm install vuetifyjs/vuetify#v1.5.2
I get "Cannot find package".
UPDATE:
There is a packages folder under which there is a vuetify directory.
I tried npm installing that folder. Everything appeared to go well until I started the dev server.
Now in the console log I see:
[Vuetify] Multiple instances of Vue detected
Seems to be related to https://github.com/vuetifyjs/vuetify/issues/4068 but I cannot tell what the solution is at this point.
I had the same issue to use my own version of Vuetify, waiting for my pull request being accepted.
Here what I did:
I build the vuetify project with my fix.
yarn
yarn build
Then I took the content of 'packages/vuetify' and put it in a new git repository. I remove the .gitignore to be able to commit built files (/es5, /lib, /lib-temp, /dist)
Finally I add this git repository to my project to replace my vuetify version:
npm install git+https://gitlab.com/GITLABUSERNAME/REPOSITORYNAME.git
Looking at the package.json file, the package doesn't have a name property, which it would need to have for you to be able to install it from GitHub.
So the short answer is that you can't install vuetify directly from GitHub via npm.
However, you can install it directly from npm:
npm install vuetify#1.5.2
You can't install vuetify directly from GitHub but you can edit code in 1 component node_modules/vuetify/lib/components/VSlider/VSlider.js Then, you install patch-package and execute path package vuetify Delete node modules and execute yarn to create new node modules Last, yarn serve, you see your code is work
https://www.npmjs.com/package/patch-package

How do I make changes to the v-slider component and test it in my app?

I tried editing inside node_modules but the files are taken from dist and src seems to be ignored.
I tried npm run build to see if I can push my changes to dist but that doesn't work either as other dependencies seem to be missing.
UPDATE:
I followed the instructions about set up dev env in the Contributing section of the docs.
Made the changes and did yarn and yarn build
But the dist folder is identical to the one without my changes
What gives?
Instructions in the set up dev env in the Contributing section work.
After running "yarn build" in the cloned repository folder, you can copy the contents of the dist folder under packages/vuetify to the dist folder under node_modules/vuetify of the app being developed and your changes can be tested.
You can also do npm run build inside packages/vuetify for subsequent changes.
You can edit code in node_modules/vuetify/lib/components/VSlider/VSlider.js
Then, you install patch-package and execute path package vuetify
Delete node modules and execute yarn to create new node modules
Last, yarn serve, you see your code is work
https://www.npmjs.com/package/patch-package

Lerna specify run order

In my monorepo, I have 3 packages package1, package2, package3, each package contains a npm script named build.
However, these packages are not linked together. I.e. there are no require() in any of those packages linking to a sibling package.
From the root folder, I run lerna run build. It seems to run build of the packages in the alphabetically order.
Is there a way to specify the order to run the build commands of these packages?
--sort won't work because they are not linked.
You don't specify the order, you specify the topology by including a package as a dependency of another.
If package1 needs to be built before package2 you add package1 to the dependencies of package2 in the latter's package.json file. If you do not want package2 to directly depend on package1 (e.g. on production) you can still add it into devDependencies and Lerna will understand the dependency.
From lerna -h:
--sort Sort packages topologically (dependencies before dependents).
Pass --no-sort to disable. [boolean] [default: true]
Note Some commands can be ran ignoring this topology, for example from lerna exec's --parallel option documentation:
completely disregards concurrency and topological sorting
lerna run build --include-dependencies --stream
--include-dependencies this flag can help
You can first build your shared package and after that trigger another build.
Ex :
yarn workspace #shared run build && yarn lerna run build

Yarn - remove package best practices

If you want to remove a package using Yarn should you:
run yarn remove [package]
or
delete it from package.json and run yarn install
Do both work the same? Will #2 update yarn.lock?
If you run yarn remove [package] it will remove the package from node_modules and also from the yarn.lock file.
If you manually delete from package.json and then run yarn install, the deleted package is not installed and the yarn.lock file is not updated.
When you remove with Yarn by running the first approach (#1).
yarn remove [package]
Both your entries from lockfile and package.json are removed. Look out for this message in the terminal.
$ yarn remove x2js
yarn remove v0.27.5
[1/2] Removing module x2js...
[2/2] Regenerating lockfile and installing missing dependencies...
success Uninstalled packages.
Done in 2.34s.
The new file won't have the package.
If you follow the second (#2) approach and delete it from package.json and run:
yarn install
There will we no effect on your lockfile.
So it is better to remove packages using the first approach (#1).
If you have deleted some package(s) directly from package.json and don't know what was there then your lockfile is not up to date.
I would suggest you delete the yarn.lock file . and then run yarn install. This way, you will get an updated yarn.lock file.
Automatic Deletion
yarn remove <package-name>
Manual Deletion
In case of manual removal of package from package.json ,
delete yarn.lock file and run yarn install
Best way to remove any package is
yarn remove "your package name"
Your package name should be same as your package.json file

Resources