वेबपैक resol.alias टाइपस्क्रिप्ट के साथ काम नहीं करता है?

Question

मैं

से import {Hello} from "./components/Hello";

import {Hello} from "Hello"; को

मुझे पता चला आप webpack में resolve.alias उपयोग कर सकते हैं कि के लिए इस प्रकार मैं उस भाग के लिए कॉन्फ़िगर टाइपप्रति में मेरी आयात कम करने के लिए कोशिश निम्नलिखित के रूप में

resolve: { 
    root: path.resolve(__dirname), 
    alias: { 
     Hello: "src/components/Hello" 
    }, 
    extensions: ["", ".ts", ".tsx", ".js"] 
}, 

वेबपैक बनाता है, और आउटपुट bundle.js काम करता है। हालांकि टाइपस्क्रिप्ट की इंटेलिजेंस शिकायत करती है कि cannot find the module

तो मेरा सवाल यह है कि वेबपैक का संकल्प है या नहीं .alias टाइपस्क्रिप्ट के साथ काम करता है?

मुझे निम्नलिखित issue मिला लेकिन इसका कोई जवाब नहीं है।

Answer 1

आप ts-loader का उपयोग कर रहे हैं, तो आप अपने tsconfig.json में अपने webpack अपने paths सेटिंग के साथ alias/resolve सेटिंग्स सिंक्रनाइज़ करने के लिए हो सकता है।

{ 
    "compilerOptions": { 
     "baseUrl": "./", 
     "paths": { 
      "Hello": ["src/components/Hello"] 
     } 
    } 
} 

आप awesome-typescript-loader उपयोग कर रहे हैं, तो webpack इस बाहर स्वचालित रूप से paths सेटिंग से अपने tsconfig.json में लगा सकते हैं, प्रति the status on this issue from the repo के रूप में। इस तरह, आपको अपने वेबपैक alias फ़ील्ड में एक ही जानकारी को डुप्लिकेट करने की आवश्यकता नहीं है।

Answer 2

मैं और लगता है आप ऐसा कर सकते हैं जिस तरह से आप का वर्णन काम किया है:

resolve: { 
    root: [ 
     path.resolve(__dirname), 
     <path_to_components_directory> //e.g. path.resolve(__dirname, 'src', 'components') 
    ], 
    extensions: ["", ".ts", ".tsx", ".js"] 
}, 

तो फिर तुम import {Hello} from "Hello";

कर सकते हैं मैं जानता हूँ कि मैं अपने src/js निर्देशिका में फ़ाइल पथ को हल करने ऐसा करने । हालांकि मैं टाइपस्क्रिप्ट का उपयोग नहीं कर रहा हूं, लेकिन मुझे नहीं लगता कि यह परिणाम को प्रभावित करेगा।