वेबपैक

Question

के साथ एक सादा JSON फ़ाइल के रूप में बंडल JSON मेरे पास एक वेब-ऐप है जिसके लिए कॉन्फ़िगरेशन JSON फ़ाइल की आवश्यकता होती है जिसमें एंड-पॉइंट और अन्य आवश्यक स्टार्ट-अप पैरामीटर शामिल हैं।

module.exports = { 
    "name": "foo", 
    "key": true, 
}; 

क्या मैं चाहूँगा मैदान है वर्ष JSON यह पार्स किया जा सकता है जिसका अर्थ है:

अगर मैं json-लोडर का उपयोग करें, फ़ाइल नहीं "असली json", यह कुछ इस तरह दिखाई देंगे और वेब सर्वर पर भेजने से पहले तैनाती प्रक्रिया के हिस्से के रूप में बदल दिया गया जहां से इसकी सेवा की जाएगी।

फ़ाइल-लोडर का उपयोग करने का एक विकल्प है। हालांकि, इसका मतलब है कि (हालांकि यह एक छोटा काम है) मुझे फाइल को डाउनलोड करने के लिए कोड लिखना है। मैं वेबपैक इसे संभालना चाहता हूं और उपलब्ध होना चाहता हूं।

क्या कोई तरीका है कि मैं require एक JSON फ़ाइल कर सकता हूं, जिसे एक सादे पुराने JSON फ़ाइल के रूप में लिखा गया है और रन टाइम पर आयात किया गया है?

Answer 1

वहाँ एक रास्ता है कि मैं require कर सकते हैं एक JSON फ़ाइल है, जो एक सादे पुराने JSON फ़ाइल के रूप में लिखा और रन टाइम पर आयात किया जाता है?

वेबपैक संकलन-समय पर कार्य करता है। इसका मतलब है कि जब आपको फ़ाइल की आवश्यकता होती है, तो वह उस फ़ाइल को लोड करता है, लोडर-चेन द्वारा निर्दिष्ट संशोधनों को निष्पादित करता है और आपको उस श्रृंखला से अंतिम परिणाम निर्यात करता है। तो आप लोडर की तरह आवाज़ के लिए क्या पूछ रहे हैं, जो फ़ाइल लोडर की तरह काम करता है, लेकिन एक आईआईएफई निर्यात करता है जो आवश्यक फाइल के लिए वादा करता है।

सिद्धांत रूप में यह एक webpack लोडर बनाना संभव है, मान लीजिए कि एक async-फ़ाइल-लोडर कि फ़ाइल-लोडर से इनपुट हो जाता है आप के लिए async requst संभाल लेंगे। के तरह कुछ मान लेते हैं:

const promisedFile = require('async-file-loader!file-loader!./myJson.json'); 
promisedFile.then(file => { console.log(JSON.parse(file)); }); 

लेकिन फिर अनुरोध से निपटने के लिए पूरे तर्क यह है कि कॉल के भीतर boundled किया जाएगा। async-फ़ाइल-लोडर कुछ इस तरह दिखेगा:

:

module.exports = function(source) { 
    return `module.exports = eval("(function(url){ 
     /* define async request func, preform request and return promise in here */ 
    })(${url})")`; 
} 

सुंदर बुरा ...

आप क्रम में अपने json-फ़ाइल को लोड करना चाहते हैं, मैं 2 विकल्प दिखाई देंगे

1. फ़ाइल लोडर का उपयोग करें और जेसन फ़ाइल को अपने आप पर असुरक्षित तरीके से अनुरोध करें।
2. सर्वर-पक्षीय स्क्रिप्टिंग भाषा का उपयोग करें और .html फ़ाइल में कॉन्फ़िगर इंजेक्ट करें। यदि आप अपने बैकएंड पक्ष पर उदाहरण के लिए नोडजेज़ का उपयोग कर रहे हैं और अभिव्यक्त करते हैं, तो अनुरोध को पूरा करने से पहले आप आसानी से Cheerio का उपयोग करके कॉन्फ़िगर इंजेक्ट कर सकते हैं।

Answer 2

जैसा कि शब्बी ने ऊपर कहा था, वेबपैक एक मॉड्यूल बंडलर है और समय से पहले आपकी फ़ाइलों को संकलित करता है।

ऐसा लगता है कि रनटाइम पर पहुंचने के लिए आपको समय कॉन्फ़िगरेशन फ़ाइल (जेसन) जोड़ने की आवश्यकता है। इसके लिए, वेबपैक के साथ इसे बंडल करने के बजाय सामान्य AJAX कॉल का उपयोग करके फ़ाइल को लोड करना होगा।