I’m trying to set up a new project and came across an installation command that looks like npm install -D webpack-dev-server. I’ve seen this -D parameter used in various npm commands but I’m not sure what it actually does.
I understand that npm install by itself adds packages to my project, but what’s the difference when you add the -D flag? Does it change where the package gets installed or how it behaves?
I want to make sure I’m using the right command for my project setup. Can someone explain what this flag means and when I should use it versus a regular npm install?
Think of it this way - the -D flag separates tools you need to build your project from libraries your actual application depends on. When I was starting out, I made the mistake of installing everything without the -D flag and ended up with massive production bundles because webpack, babel, and testing tools were all being shipped to users. The -D flag puts packages in devDependencies, which means they won’t be installed when someone runs your app in production. For webpack-dev-server specifically, you definitely want -D since it’s just a local development server. A good rule of thumb is to ask yourself: does my running application need this package to function? If no, use -D. This includes anything related to building, testing, linting, or development workflows. Regular npm install without flags is for actual runtime dependencies like express, react, or lodash.
The -D flag is shorthand for --save-dev, which installs packages as development dependencies rather than production dependencies. When you run npm install -D, the package gets added to the devDependencies section of your package.json file instead of the regular dependencies section. Development dependencies are packages you only need during development - things like build tools, testing frameworks, linters, and bundlers. In your webpack-dev-server example, that’s a perfect use case since you only need the dev server while developing, not when your application runs in production. The practical difference becomes apparent when someone runs npm install --production or when deploying to production environments. Regular dependencies get installed, but devDependencies are skipped, keeping production builds lighter and more secure. I learned this the hard way when I accidentally installed a build tool as a regular dependency and it caused issues in production deployment.
basically -D just means devDependency vs regular dependency. its like having seperate boxes for stuff you only need while coding vs stuff your app actually needs to run. webpack-dev-server is definitly a -D thing since users dont need it, only you do for developement. saves space in production builds too