Design Converter
Education
Last updated on Mar 11, 2025
•4 mins read
Last updated on Mar 11, 2025
•4 mins read
Software Development Executive - II
I know who I am.
What does the npm save flag do?
The npm save flag helps manage installed packages in a project. When running npm install, the --save, --save-dev, and --save-optional flags decide where the package gets listed in the package.json file. Knowing how these flags work makes it easier to track dependencies for development and production.
Let’s break down how each one works.
The save flag in npm dictates how an installed package is recorded inside the package.json file. By default, npm install without any flag installs the package into the node_modules directory but does not update the dependencies section of the package.json file. Using different save flags, you can control whether a package is recorded under dependencies, devDependencies, or optionalDependencies.
Earlier versions of npm (before version 5) required the --save
flag to add the package to the dependencies section of the package.json file.
1npm install lodash --save
This command installs the lodash package and updates the dependencies section in the package.json file like this:
1{ 2 "dependencies": { 3 "lodash": "^4.17.21" 4 } 5}
Since npm v5 and later, this behavior is now the default.
The save-dev flag is used to install npm packages that are needed only during development. These packages do not get included in a production build.
1npm install jest --save-dev
The package.json file gets updated like this:
1{ 2 "devDependencies": { 3 "jest": "^29.0.0" 4 } 5}
Use save-dev when installing:
• testing frameworks (e.g., Mocha, Jest)
• build tools (e.g., Webpack, Babel)
• Code linters and formatters (e.g., ESLint, Prettier)
Mermaid Diagram for Dependency Organization:
The save-optional flag is used when a package is not critical for the application but can be installed if needed.
1npm install fsevents --save-optional
This command installs the package under the optionalDependencies section in the package.json file:
1{ 2 "optionalDependencies": { 3 "fsevents": "^2.3.2" 4 } 5}
Use this for packages that enhance functionality but are not strictly required.
If you want to install a package without modifying the package.json file, use:
1npm install lodash --no-save
This installs lodash but does not update the dependencies section.
When working on a project, some npm packages are needed only during development, while others are required in production.
To install only production dependencies, use:
1npm install --production
This excludes dev dependencies.
For a full install, including both production and development dependencies:
1npm install
When installing npm packages, specifying a version helps maintain consistency.
1npm install react@18.2.0 --save
This adds:
1{ 2 "dependencies": { 3 "react": "18.2.0" 4 } 5}
Use an exact version when stability is needed.
npm supports version ranges to allow updates within specified limits:
• Caret (^): Updates within the same major version (^1.2.3 allows 1.x.x)
• Tilde (~): Updates within the same minor version (~1.2.3 allows 1.2.x)
• Local Installation (Default): Packages are installed in the current working directory inside node_modules.
• Global Installation: Use the g flag to install a package globally.
1npm install eslint -g
The devdependencies sections of the package.json file store npm packages required for development.
Example package.json file:
1{ 2 "dependencies": { 3 "express": "^4.18.2" 4 }, 5 "devDependencies": { 6 "jest": "^29.0.0", 7 "webpack": "^5.0.0" 8 } 9}
To install both dependencies and dev dependencies, use:
1npm install
By default, npm installs packages from the default registry, which is https://registry.npmjs.org/ . Scoped packages belong to a specific organization and use a scope name.
Example:
1npm install @angular/core
To remove an installed package:
1npm uninstall lodash
For dev dependencies:
1npm uninstall webpack --save-dev
The npm save flag helps keep project dependencies organized in the package.json file. Using --save-dev for development, --save-optional for optional dependencies, and --save for production makes it easier to manage packages. Keeping dependencies sorted ensures smooth version control and a more organized workflow. Knowing how to use the npm save flag can make package management simpler and less stressful.
Tired of manually designing screens, coding on weekends, and technical debt? Let DhiWise handle it for you!
You can build an e-commerce store, healthcare app, portfolio, blogging website, social media or admin panel right away. Use our library of 40+ pre-built free templates to create your first application using DhiWise.