# Configuration और modes — Webpack

Source: https://www.geekswithgeeks.com/hi/webpack/webpack-06

> Configuration options के साथ Webpack को fine-tune करें।

## Development बनाम production

**Development mode** readability और fast rebuild times के लिए optimizations को disable करता है। **Production mode** code minification, tree-shaking को enable करता है। अपने current task के आधार पर mode choose करें।

## Environment-based configuration

Configuration को switch करने के लिए environment variables use करें।

```javascript
module.exports = (env, argv) => {
  const isDev = argv.mode === 'development';
  
  return {
    mode: argv.mode || 'production',
    devtool: isDev ? 'source-map' : false,
    optimization: {
      minimize: !isDev,
      usedExports: true
    }
  };
};
```

Output:

```
Configuration adjusts based on build mode parameter
```

## Debugging के लिए sourcemaps

Development में sourcemaps को 'source-map' या 'eval-source-map' के साथ enable करें। Sourcemaps bundled code को original sources से map करते हैं।

त्वरित जाँच

**Quiz:** Production mode का उपयोग कब करना चाहिए?

- [x] Final deployments के लिए bundle size को minimize करने के लिए।
- [ ] Development के दौरान fast rebuilds के लिए।
- [ ] Better debugging को enable करने के लिए।

*Answer:* Final deployments के लिए bundle size को minimize करने के लिए।. Production mode size और performance के लिए optimize करता है। Development mode rebuild speed को prioritize करता है।