# Module resolution — Webpack: Module Bundling और Build Optimization

Source: https://www.skillbyai.com/hi/webpack/webpack-07

> Webpack module resolution समझें, फिर साफ़ और आसानी से refactor होने वाले imports के लिए aliases और file extensions सेट करें।

## Webpack modules को कैसे resolve करता है

जब आप एक module import करते हैं, Webpack एक specific resolution algorithm का उपयोग करके इसे search करता है। यह node_modules में देखता है, file extensions को check करता है।

## Resolution को configure करें

Cleaner imports के लिए aliases और extensions set up करें।

```javascript
module.exports = {
  resolve: {
    alias: {
      '@': path.resolve(__dirname, 'src/')
    },
    extensions: ['.js', '.json', '.css'],
    mainFields: ['browser', 'module', 'main']
  }
};
```

Output:

```
Now import '@/components/Button' instead of '../../../components/Button'
```

## Alias import depth को reduce करता है

Aliases का उपयोग imports को cleaner बनाता है। अगर आप एक component को move करते हैं, तो दर्जनों files में paths को update करने की जरूरत नहीं है।

त्वरित जाँच

**Quiz:** Module resolution क्या करता है?

- [ ] Module code में errors को fix करता है।
- [ ] Modules को different formats में convert करता है।
- [ ] Modules को npm registry पर upload करना।
- [x] Webpack के algorithm के अनुसार modules को find और load करता है।

*Answer:* Webpack के algorithm के अनुसार modules को find और load करता है।. Resolution module file को find करने की process है जब आप इसे import करते हैं।