What are devDependencies and dependencies?

DevDependencies: The toolkit on which development depends;

Dependencies: Dependencies required when the project normally allows

If you want to know devDependencies and devDependencies, please read on.

What package is placed in devDependencies? What package is placed in Dependencies?

To understand this problem, we should first understand the whole process of the front-end project coming online:

  • Push the code to GitLab after local development is complete;
  • NPM install is executed when CI builds; NPM run build; To compile the DIST file
  • Deploy the compiled file dist online;

In this way, every time we access the system, we will go to the online server to get the DIST file to execute.

Execute the following commands within a project:

NPM install: installs devDependencies and dependencies

npm install –production : Install dependencies for Dependencies only. (This command is rarely used, and it is very easy to fail a project build if you configure this command on CI, because if you put the package that should be added to Dependencies into devDependencies, the build will fail.)

Install component A within A project:

NPM install devDependencies of A: The devDependencies of A component are not downloaded

NPM install is used to build the server configuration in devDependencies. It doesn’t matter if you install the dependencies in devDependencies, but if you develop the project as a component library, you download it. Again, it is recommended to strictly manage devDependencies and dependencies.

Add babel-loader and style-loader to devDependencies. Add babel-loader and style-loader to devDependencies. Add babel-loader and style-loader to devDependencies. If you want to install the component library in Dependencies, install it in devDependencies. If you want to install the package-related, esLint-related, loader-related libraries in devDependencies, install them in devDependencies.

Conclusion:

  • If you are developing a project, it makes no difference whether the dependencies are installed in devDependencies or dependencies.
  • If you are developing component libraries, it is recommended to put the libraries referenced by code runtime into Dependencies, and other compile packaging, ESLint verification, and developing-related packages into devDependencies.