पाठ 3 / 25

Core concepts: entry और output

Webpack entry points और output filenames configure करें, जिसमें भरोसेमंद cache busting के लिए [contenthash] naming शामिल है।

Entry और output समझाया गया

Entry Webpack को बताता है कि bundling कहाँ से शुरू करनी है। यह एक single file या multiple entry points हो सकता है। Output specify करता है कि bundled files को कहाँ write करना है और उनके नाम क्या होंगे।

Multiple entry points

अपने application के विभिन्न parts के लिए अलग bundles बनाएँ।

module.exports = {
  mode: 'production',
  entry: {
    app: './src/app.js',
    vendor: './src/vendor.js'
  },
  output: {
    filename: '[name]-[contenthash].js',
    path: __dirname + '/dist'
  }
};

Output:

Creates: app-a1b2c3d4.js, vendor-x9y8z7w6.js

Cache busting के लिए contenthash का उपयोग करें

[contenthash] file content के आधार पर unique hashes generate करता है। जब content बदलता है, hash बदलता है, browsers को नया version fetch करने के लिए force करता है।

त्वरित जाँच

त्वरित जाँच: [contenthash] output filename में क्या करता है?

  • File को automatically compress करता है।
  • Bundle में metadata जोड़ता है।
  • यह तय करना कि file को कौन-सा loader process करेगा।
  • File content के आधार पर unique hash generate करता है।
Answer

File content के आधार पर unique hash generate करता है। — Content hash filename को बदलकर cache busting ensure करता है जब content बदलता है।