मैं पार्टी के लिए वास्तव में देर से हूं, लेकिन मैं भी इस मुद्दे से बेहद निराश था और मुझे कोई संतोषजनक समाधान नहीं मिला या आसपास काम नहीं किया। इसलिए मैंने इस मुद्दे के आसपास बेहतर काम करने के लिए कुछ सुंदर गंदे चालें कीं। तो मैं इसे आपके साथ साझा करना चाहता हूं।
सबसे पहले, आइए जल्दी से समीक्षा करें कि यह समस्या क्यों होती है। जब usemin आउटपुट जेएस/सीएसएस फ़ाइलों को उत्पन्न करता है, तो यह आपके dest निर्देशिका और आपके उपयोगकर्ता नाम में निर्दिष्ट आउटपुट निर्देशिका के बीच एक सरल पथ शामिल होता है।तो अगर destbuild है और usemin ब्लॉक
<!-- build:css(.) app.min.css -->
तो यह buildapp.min.css साथ build/app.min.css
पर आउटपुट फ़ाइल थूक से बाहर करने के लिए मिलती है लेकिन फिर usemin कार्य बस अपने ब्लॉक में पथ की जगह आप अंत करने के लिए है
<link rel="stylesheet" href="app.min.css"/>
जो अब अपनी HTML फ़ाइल के बाद से गलत निर्देशिका लिंक हो रहा है build/dashboard/index.html
0 किया जा रहा है साथ
तो मेरा काम इस विचार के चारों ओर घूमता है: क्या होगा यदि dest निर्देशिका HTML फ़ाइल कहां से संबंधित है? क्या यह इस मुद्दे को हल नहीं करेगा? तो उपर्युक्त उदाहरण दिया गया है, तो क्या होगा यदि destbuild/dashboard है? आप देख सकते हैं कि यह आउटपुट फ़ाइल स्थान थूक जाएगा और इसे सही तरीके से लिंक करेगा। ध्यान रखें कि आपको अपनी HTML फ़ाइलों की प्रतिलिपि बनाने के लिए एक प्रति कार्य बनाना है, इसलिए सुनिश्चित करें कि आपकी HTML फ़ाइल को पहले से build/dashboard/index.html पर कॉपी किया गया है।
बेशक, अगला प्रश्न होगा यदि मेरे पास एकाधिक निर्देशिकाओं में HTML फ़ाइलें हैं? क्या वह प्रत्येक निर्देशिका के लिए useminPrepare लक्ष्य बनाने के लिए सुपर दर्दनाक और अनजान नहीं होगा, जहां HTML फ़ाइलें रह सकती हैं? यही कारण है कि मैं इस मुद्दे के आसपास काम करने के लिए एक बहुत ही खास गड़बड़ी का काम करता हूं, जबकि मैं अपनी खुद की गंदगी मचान बना रहा था। मैं इसे useminPreparePrepare कहता हूं हां, यह जानबूझकर बेवकूफ नामित है, क्योंकि मैं इस बात को पूरी तरह से एक दिन हटाने की उम्मीद कर रहा हूं जब लोग इस मुद्दे के लिए वास्तविक सुधार करते हैं।
जैसा कि इसके नाम से पता चलता है, यह useminPrepare कॉन्फ़िगरेशन तैयार करने का एक कार्य है। यह वही करता है जो मैंने ऊपर वर्णित किया है। इसकी सभी कॉन्फ़िगरेशन useminPrepare कॉन्फ़िगरेशन (वास्तव में, उनमें से अधिकतर आसानी से useminPrepare पर प्रतिलिपि बनाई गई हैं) मिरर: एक अपवाद के साथ: आपको अपने सभी स्रोतों की मूल निर्देशिका की पहचान करने के लिए src निर्देशिका निर्दिष्ट करने की आवश्यकता है ताकि यह सापेक्ष पथ उत्पन्न कर सके एचटीएमएल फाइलों के लिए। तो आपके उदाहरण में src: "." ठीक होगा। UseminPreparePrepare का उपयोग करने के लिए, इसे पहले अपने निर्माण में आयात करें (आप बस मेरे कोड को कॉपी और पेस्ट करना चाहते हैं, मुझे कोई फर्क नहीं पड़ता), अपने usemin का नाम बदलें useminPreparePrepare पर कार्य करें और src संपत्ति जो मैंने अभी उल्लेख की है। सुनिश्चित करें कि आप जो भी लक्ष्य चाहते हैं, उसके साथ useminPreparePrepare चलाएं, फिर लक्ष्य निर्दिष्ट किए बिना तुरंत useminPrepare चलाएं ताकि सभी अपने लक्ष्य के चल रहे हों। ऐसा इसलिए है क्योंकि useminPreparePrepare प्रत्येक निर्देशिका के लिए एक लक्ष्य उत्पन्न करेगा जहां एचटीएमएल फाइलें मिलती हैं और useminPreparePrepare के लिए आपकी कॉन्फ़िगरेशन पर प्रतियां आपके भाग को लक्षित करती हैं। इस तरह, आपकी कॉन्फ़िगरेशन बस सभी HTML फ़ाइलों को देख सकती है।
उदाहरण
"useminPreparePrepare": {
// Search for HTML files under dashboard even though src is .
// because we want to avoid including files generated under build directory.
html: "dashboard/**/*.html",
options: {
src: ".",
dest: "build",
...
"usemin": {
html: ["build/**/*.html"],
...
"copy": {
html: {
files: [{
expand: true,
src: ["dashboard/**/*.html"],
dest: "build"
}
]
},
...
आशा इस मदद करता है! आपका दिन शुभ हो।
संपादित करें: मैंने महसूस किया कि ऊपर के उदाहरण दिए गए हैं, अगर आप वास्तव में वर्तमान निर्देशिका से सभी HTML फ़ाइलों में शामिल हैं, तो आप उत्पन्न HTML फ़ाइलों भी शामिल होंगे यदि वे समय से आगे साफ नहीं कर रहे हैं। तो या तो आप उन्हें उनके आगे साफ़ करें या dashboard निर्देशिका के अंतर्गत देखें। मैं src और dest निर्देशिकाओं को अलग करने की अनुशंसा करता हूं ताकि कॉन्फ़िगरेशन अधिक सहजता से देख सके।