Lerna best practices for managing front-end modules

Recently, LERNA has been used in the management of front-end packages, and the efficiency has been improved a lot. So I’m going to summarize some of my experience in using LERNA in recent months. Please forgive me for my inadequacies.

This article mainly includes some considerations in using LERNA, and the integration with other tools in the use process, resulting in a best practice.

Package refers to a directory structure that can be published through the NPM package management tool.

Problems facing front-end development packages

When the package was first developed, it was still a slash-and-burn phase. There are no automated tools. When you release a package, you manually change the version number. A small number of packages is acceptable. But when the number of packages increases and there are dependencies between them, it can be painful for developers. The work is not only tedious but also takes a lot of time.

For example, if you are maintaining two packages. The values are module-1 and module-2. Here are the dependencies of the two packages.

// module-1 package.json
{

    "name": "module-1"."version": "1.0.0"."dependencies": {

        "module-2": "^ 1.0.0"}}Copy the code

//module-2 package.json
{

"name": "module-2"."version": "1.0.0",}Copy the code

In such an environment, Module-1 is dependent on Module-2. If modulo-2 is modified, publish it. So your job has these.

Modify the version number of Module-2 and release it.
Change the dependency of Module-1, change the version number of Module-1, and release it.

And that’s just two packages. If the dependencies are more complex, you can imagine how much work the release would take.

What is a lerna? Why use LERNA?

So what is a lerna? This is how lerna describes it on its website.

A tool for managing JavaScript projects with multiple packages.

With lerNA, not only will the above problems be solved, but developers will also have a way to manage multi-packages javascript projects.

Automatically resolve dependencies between Packages
throughgitDetects file changes and automatically publishes them
According to thegitSubmit records to automatically generate CHANGELOG

Basic workflow using LERNA

Environment configuration

Git in a LERNA project, is to conduct code management through Git. Make sure you have the right Git environment locally. If you need to work with multiple people, create a link to the correct Git central repository first. So you need to know the basics of Git, which I won’t cover here.
NPM Warehouse Whether the package you manage is to be published on the website or on the company’s private server, you need the correct warehouse address and user name. You can check the local NPM by running the following commandregistryThe address is correct.

npm config ls
Copy the code

Lerna You need to install the LERNA tool globally.

npm install lerna -g
Copy the code

Initialize a LERNA project

In this example, I will initialize a LERna project in my local d:/ root directory.

ind:/Create an empty folder and name itlerna-demo

mkdir lerna-demo
Copy the code

Initialize Run CMD to go to the related directory and initialize

cd d:/lerna-demo
lerna init
Copy the code

After the execution succeeds, the directory structure will be generated in the directory.

-packages -lerna. json -package. json -package.Copy the code

Add a test package

By default, packages are placed in the Packages directory.

// Go to the packages directorycdD :/lerna-demo/packages // Create a packge directory mkdir module-1 // Go to the module-1 package directorycd// Initialize a package NPM init -yCopy the code

The directory structure of the project is as follows

--packages
	--module-1
		package.json
--lerna.json
--package.json

Copy the code

Installing the packages dependencies is described on the website.

Bootstrap the packages in the current Lerna repo. Installs all of their dependencies and links any cross-dependencies.

cd d:/lerna-demo
lerna bootstrap
Copy the code

In the current test package, Module-1 does not have any dependencies, so to be more realistic. You can already add dependencies to third-party libraries in the package.json file of Mode-1. This way, when you finish executing this command, you will see that the mode-1 dependency is already installed.

Release is needed at release timegitThe tools fit together. Therefore, before publishing, please make sure that the LERna project is connected to git’s remote repository. You can run the following command to check.

git remote -v
// print log
origin  [email protected]:LittleBreak/lerna-best-practices.git (fetch)
origin  [email protected]:LittleBreak/lerna-best-practices.git (push)
Copy the code

The code for this article is hosted on Github. Therefore, this remote link information is displayed. If you haven’t already linked to a remote repository, create an empty repository on Github and follow the prompts to link to it.

lerna publish
Copy the code

With this command, you can release packges step by step as prompted in CMD.

In fact, lerna will do a lot of work in executing this order.

 -  Run the equivalent of  `lerna updated`  to determine which packages need to be published.
 -  If necessary, increment the  `version`  key in  `lerna.json`.
 -  Update the  `package.json`  of all updated packages to their new versions.
 -  Update all dependencies of the updated packages with the new versions, specified with a  [caret (^)](https://docs.npmjs.com/files/package.json#dependencies).
 -  Create a new git commit and tag for the new version.
 -  Publish updated packages to npm.
Copy the code

So far, this is a simple lerNA workflow. But there’s more to lerna than that. Lerna works in two modes,Independent mode and Fixed/Locked mode, which may be confusing for beginners, but are important enough to mention. The default mode of LERNA is Fixed/Locked mode. In this mode, lerNA actually treats the project as a whole. Every time the Packges are released, they are released in full, with or without modifications. However, in Independent mode, Lerna will cooperate with Git to check file changes and only release packge with changes.