मैं वेबपैक 2 मॉड्यूल.रूल्स में 'उपयोग' और 'लोडर' का उपयोग कब करूं?

Question

मैं अपनी वर्तमान प्रोजेक्ट को वेबपैक 2 में अपग्रेड कर रहा हूं, जो पहले वेबपैक 1 का उपयोग कर रहा था। मैंने उन्नयन के बारे में कुछ ट्यूटोरियल देखे हैं और सामान्य रूप से, मैं समझता हूं।

समस्या जो मैं चल रहा हूं, हालांकि, मुझे यकीन नहीं है कि मॉड्यूल नियम (लोडर) निर्दिष्ट करते समय 'उपयोग' और 'लोडर' का उपयोग कब किया जाए। सबसे पहले, मैंने सोचा useloader बदल दिया। मैं वाक्य रचना के इस प्रकार को समझने:

module: { 
    rules: [{ 
    test: /\.scss$/, 
    use: [ 
     { 
     loader: 'postcss-loader', 
     options: { 
      plugins: ... 
     } 
     }, 
     'sass-loader' 
    ] 
    }] 
} 

हालांकि, जब मैं ExtractTextPlugin का उपयोग यह जब यह एक use consdiered है पसंद करने के लिए प्रतीत नहीं होता। साथ scssLoaders किया जा रहा है

 { 
     test: /\.scss$/, 
     use: [ 
      { 
      loader: ExtractTextPlugin.extract({ 
       fallbackLoader: 'style-loader', 
       loader: scssLoaders 
      }) 
      }] 
     }, 

:: मैं इस कोशिश की है

var scssLoaders = [ 
    { 
    loader: 'css-loader', 
    options: { 
     modules: true, 
     importLoaders: '2', 
     localIdentName: '[name]__[local]__[hash:base64:5]' 
    } 
    }, 
    { 
    loader: 'postcss-loader' 
    }, 
    { 
    loader: 'sass-loader', 
    options: { 
     outputStyle: 'expanded', 
     sourceMap: true, 
     sourceMapContents: true 
    } 
    } 
]; 

इससे पहले कि मैं अन्य समस्याओं के बारे में बाहर जाने मैं बस यहाँ बंद कर देंगे। क्या कोई इस बात की व्याख्या करने में मदद कर सकता है कि मैं यहां क्या खो रहा हूं? मदद करने के लिए आपको आवश्यक किसी भी अन्य कोड के लिए पूछने के लिए स्वतंत्र महसूस करें! पहले ही, आपका बहुत धन्यवाद।

Answer 1

Webpack 2 migration tutorial राज्यों के रूप में, दोनों के बीच अंतर है, जब हम लोडर की एक सरणी चाहते हैं, हम, use उपयोग करने के लिए अगर यह सिर्फ एक लोडर है है, तो हम loader का उपयोग करना होगा:

module: { 
    rules: [ 
     { 
     test: /\.jsx$/, 
     loader: "babel-loader", // Do not use "use" here 
     options: { 
      // ... 
     } 
     }, 
     { 
     test: /\.less$/, 
     loader: "style-loader!css-loader!less-loader" 
     use: [ 
      "style-loader", 
      "css-loader", 
      "less-loader" 
     ] 
     } 
    ] 
    } 

Answer 2

module.rules लोडर के लिए है। loader के रूप में नियम निर्दिष्ट करना use: [{loader}] के लिए एक शॉर्टकट है।

प्लगइन के लिए, अपनी कॉन्फ़िगरेशन में plugins संपत्ति का उपयोग करें।