Count the list of third-party components of an open source project

Preface ：

background

Two open source projects , Count the component list .

That good guy , I think there is little content , The statistics will be finished in a moment .

One java：https://github.com/zchuanzhao/jeesns

Did the statistics ： At all levels po m.xml file , Open the referenced jar,war package （ It's found that lib package , Contains many imported jar file ）

A front-end ：https://github.com/renrenio/renren-fast-vue

Manually count one by one package.json file , Not many lines , No big problem .

【nodeJs project There will be package.json The existence of , This file will record all the dependencies of running the project , And show it in the form of level 】

【 In practice, , One npm Packages often rely on several or even dozens of other packages , These extra dependent packages will not be recorded in the project package.json in , It will only be recorded in node_modules Under the installation package package.json In file , because node_modules All dependencies are stored in parallel , This will lead to too much dependence and poor management .】

【package-lock.json The internal record is the actual installation information of each dependency , For example, name , Installed version number , Installation address (npm registry Upper tar Package address ) wait . We will also record the dependencies of dependencies , The whole document is a tree structure , Save dependency nesting .】

{
    
  \"name\": \"my-lib\",
  \"version\": \"1.0.0\",
  \"lockfileVersion\": 1,
  \"requires\": true,
  \"dependencies\": {
    
    \"array-union\": {
    
      \"version\": \"1.0.2\",
      \"resolved\": \"http://registry.npm.taobao.org/array-union/download/array-union-1.0.2.tgz\",
      \"integrity\": \"sha1-mjRBDk9OPaI96jdb5b5w8kd47Dk=\",
      \"dev\": true,
      \"requires\": {
    
        \"array-uniq\": \"^1.0.1\"
      }
    }
  }
}

【 In execution npm install When , If only package.json There is （ This usually happens when you first create a project ）, Recursively install dependencies layer by layer according to its records , And generate a package-lock.json file .
If both are found in the root directory （ This usually happens when development colleagues put projects checkout After arriving here ）, be npm Will compare the two . If the two show different meanings , with package.json Subject to , And update the package-lock.json; Otherwise, press package-lock Install with the version number shown .】

The significance of its existence mainly includes 4 spot ：

1、 In team development , Ensure that the dependent versions installed by each team member are consistent . Otherwise, the effect difference caused by inconsistent dependent versions , It's usually difficult to find out .

2、 Usually node_modules Directories will not be submitted to the code base , Therefore, it is impossible to trace back to the state of a certain day . But now node_modules Contents and package.json as well as package-lock.json It's one-to-one . So if the developer wants to go back to the directory state of the previous day , Just return these two files to the state of that day , Again npm i That's it .

3、 because package-lock.json It is enough to describe node_modules General information about （ Especially deep nested dependencies ）, Therefore, through this file, you can check who is relying on a dependent package , Instead of going through node_modules Catalog （ In fact, the directory structure is now flat rather than nested , I can't turn it out ）

4、 During installation ,npm The interior will check node_modules Existing dependent packages in the directory , And on and on package-lock.json Compare . If repeat , Then skip the installation , It can greatly optimize the installation time .

npm Suggestions on the official website ： hold package-lock.json Submit to the code base together , Don't ignore. But in execution npm publish When , It will be ignored and not released .

Digression // Start

package-lock.json The role of ：

Lock the version number of the package at installation time , And need to upload to git, To ensure that others npm install When we rely on each other to ensure consistency . Fix the version of the entire dependency tree .
Only through npm install [email protected] To update dependencies , then package-lock.json Can also be updated with .
such as ：npm install [email protected]

package.json The version number of the library ：

marjor ： This version number has changed, indicating whether it can be compared with the previous version compatible Big changes .
minor ： The version number has changed, which means that new functions have been added , And it can go backwards （ Next ） compatible .
patch ： The version number has changed, which means that it has been fixed bug, And it's backward compatible .
2.5.8 Correspondence is ：2 yes marjor version;5 yes minor version;8 yes patch version.

Several ways of writing version numbers （^ and ~ The difference between ）:

"dependencies": {
    "react": "17.0.1",
    "accepts": "~1.3.7",
    "react-scripts": "^4.0.1"
    }

Specify the version ： such as 2.5.8, Install the specified version only
The waves, ~（tilde） + Specify the version ： such as ~2.5.8, Said the installation 2.5.x Latest version （ No less than 2.5.8）, But not installed 2.6.x, That is to say, the major version number and minor version number are not changed during installation .
Insert the no. ^（caret）+ Specify the version ： such as ˆ2.5.8, Said the installation 2.x.x Latest version （ No less than 2.5.8）, But not installed 3.x.x, That is to say, the major version number will not be changed during installation .
It should be noted that , If the major version number is 0, Then the insertion sign behaves the same as the tilde , This is because you are in the development phase , Even minor version number changes , It can also lead to program incompatibilities .
latest： Install the latest version
^ and ~ To sum up, the difference is ：^ It can be upgraded “ Major version . minor . Patched version ”, and ~ It can be upgraded “ Major version . minor . Patched version ”.（ Bold indicates the version number that can be upgraded ）

Wave sign ~ Used to be npm Default symbol for installation , Now the default symbol has changed to caret ^ 了 .

/// After the digression

To see a package-lock.json file , Didn't pay attention at first , Still counting manually , Until I saw the statistics for so long , Why doesn't the progress bar move , And found that , There are more than 10000 lines, nearly 20000 , At this time, I have counted 200 Multiple lines .

I have no sense of time , I think it's enough to count a hundred times

So the third day , I then count , I think there is a lot of time , Can finish

Until I found out , It's time for dinner , I just counted 2000 The number of the first row , I have to say that the manual speed is too slow .

I thought , If you don't finish it quickly, you'll stay up late , So I changed the statistical method 【 Before, statistics were made from top to bottom , Instead of counting one by one , Delete a component after statistics 】, It's a little faster , Then I found it was more than ten o'clock in the middle of the night . Just now 2000 Multiple lines

I thought , This is not right , We have to change the way .

Search the json turn excel, Seeing the code, I feel that I will learn it for a while , To give up

I think of a method suitable for me

VSCode Change any match

Select to delete { "version" Put the component name and version number on one line

Choose ::,command+️ end ,command+Shift+️ Select the content of the line to the beginning of the line

Cut the selected content into a new file , Then remove the symbols and so on .

hold ️ Paste the excel, And then use Ctrl+E Separate component name and version number .

Remember again , also "requires": I didn't fix the components in ：

Choose : ">, Just like before , Cut this line out .
Then put them in turn > Switch to 0-9【~,^ I didn't do it 】 Repeat step

stay excel in , Remove duplicates .

In fact, if you don't need to compare and insert with other tables , I have thought of this method for a long time, hahahaha .

Finally, it also costs 2.5 Hours , Compare the newly generated table with other tables side by side Make comparative statistics .

So it's 2.5 Hours of work , I've been doing it all day

Some other operations ：

I used the fifth , There are multiple cursors , That guy , It's very difficult to operate

Then there are war Some imported in the file jar package , I use tree Command to get the name

tree -a -f

It's over

devDependencies and dependencies difference

https://blog.csdn.net/u014689760/article/details/94407292

npm install The parameters of this command are –save and –save-dev：

1、 by –save -dev Will cause the downloaded plug-ins to be placed in package.json Of documents devDpendencies Inside the object

2、 by –save Will cause the downloaded plug-ins to be placed in package.json Of documents dependencies Inside the object

devDependencies It is used for the dependent packages required for local environment development .

dependencies User publishing environment , Generate the dependent packages required on

difference ：

devDependencies Dependency package under , Just what we rely on to run our code locally or in a development environment , If sent online , In fact, you don't need devDependencies All dependent packages under ;( Such as a variety of loader,babel Family barrel and various webpack Plug-ins, etc ) Only for the development environment , Not used in production environment , So there's no need to pack ;

dependencies It's our online ( Production environment ) The package you want to depend on , such as vue, We have to use it online , So put dependencies Next ;dependencies Dependent packages are not only available in the development environment , The production environment can also use