कोणीय 2 और टाइपस्क्रिप्ट node_modules का आयात

Question

मेरे पास एक बहुत ही सरल 'हैलो वर्ल्ड' Angular2 ऐप था। मैंने अपने देव परियोजना और मेरे वसंत बैकएंड पर अंतिम तैनाती फ़ोल्डर के बीच विभिन्न निर्देशिका संरचनाओं के साथ काम करने के लिए स्पष्ट रूप से अनुचित निर्णय भी बनाया।

इस अंतर की वजह से

, मैं टाइपप्रति आयात के साथ एक समस्या थी, और जब मैं अपने ब्राउज़र में वास्तविक एप्लिकेशन खोलने की कोशिश की इस पंक्ति 404 त्रुटियों (/ angular2/कोर पुस्तकालय खोजने में असमर्थ) का निर्माण समाप्त हो गया:

import {Component, View} from 'angular2/core'; 

इतने लंबे समय कहानी संक्षेप में, मैं सब कुछ काम करने के लिए/एप्लिकेशन फ़ोल्डर वापस जोड़ने समाप्त हो गया, लेकिन मैं अपने आयात बयान को संशोधित करने के रूप में निम्नानुसार समाप्त हो गया:

import {Component, View} from '../node_modules/angular2/core'; 

लेकिन यह बाहर कारण में बदल गया कुछ अजीब व्यवहार।

<script src="/node_modules/angular2/bundles/angular2.dev.js"></script> 

: कुछ पुस्तकालय पथ में ../node_modules को निर्दिष्ट कारण जे एस वास्तव में ajax npm_modules/angular2/ फ़ोल्डर भले ही यह मेरा HTML शीर्षक का हिस्सा था से प्रत्येक व्यक्ति फ़ाइल को प्राप्त करने के लिए कॉल का उपयोग कर खरोंच से सभी Angular2 फ़ाइलें लोड करने के लिए खड़ी कर रहा है

जब मैं अंत में एहसास हुआ कि मैं क्या हो रहा है

import {Component, View} from 'angular2/core'; 

वापस करने के लिए आयात बयान को वापस लाया गया और यह सब काम किया। Angular2 अब ऊपर लिपि टैग से पूरी तरह से लोड किया गया था और अतिरिक्त AJAX कॉल द्वारा लोड की गई कोई भी फाइल नहीं थी।

क्या कोई यह बता सकता है कि इसका क्या कारण है? मुझे लगता है कि यह सामान्य व्यवहार है लेकिन मुझे समझ में नहीं आता कि आयात कैसे काम करता है और अधिक विस्तृत पथ निर्दिष्ट करने से ऐसा अंतर होता है।

Answer 1

import टाइपस्क्रिप्ट के नियम node.js. के समान सम्मेलन का पालन करते हैं। एक आयात एक बिंदु के साथ शुरू होता है:

import {Something} from './some/path'; 

तो यह फ़ाइल है कि आयात की घोषणा से एक रिश्तेदार पथ के रूप में व्यवहार किया जाता है। लेकिन यह एक पूर्ण पथ है:

import {Component} from 'angular2/core'; 

तो यह एक बाहरी मॉड्यूल होने के लिए इतना टाइपप्रति पेड़ पर चलते हैं एक package.json फ़ाइल की तलाश में है, तो node_modules फ़ोल्डर में जाओ, और के साथ एक फ़ोल्डर को खोजने माना जाता है आयात के रूप में एक ही नाम है, तो मुख्य .d.ts या .ts फ़ाइल के लिए मॉड्यूल के package.json में लग रहा है, और फिर लोड करता है कि, या एक निर्दिष्ट, या एक के रूप में एक ही नाम है जो किसी फ़ाइल के लिए दिखेगा index.d.ts या index.ts फ़ाइल।

वाह जो लिखा गया जटिल लगता है, और अभी भी कुछ अपवाद हैं ... लेकिन सब कुछ, यदि आपने पहले node.js के साथ काम किया है तो यह बिल्कुल वही व्यवहार करना चाहिए। नोट करने के लिए

एक बात वहाँ एक टाइपप्रति संकलक विकल्प है कि इस तरह से

tsconfig में में काम करने के प्रस्तावों टाइपिंग के लिए सेट किया जाना चाहिए है।json

"moduleResolution": "node" 

अब आपके प्रश्न के दूसरे भाग कैसे इस ajax कॉल का उपयोग किए बिना लोड प्राप्त करता है था। यह System.js की एक विशेषता है। index.html फ़ाइल में लोड किया गया स्क्रिप्ट टैग एक बंडल आयात करता है जो सिस्टम के साथ कोणीय 2 बंडल को पंजीकृत करता है। एक बार ऐसा हो जाने के बाद सिस्टम इन फ़ाइलों के बारे में जानता है और उन्हें सही ढंग से उनके संदर्भों में असाइन करता है। यह एक बहुत गहरा विषय है लेकिन systemjs, या systemjs-builder के README में बहुत सारी जानकारी मिल सकती है।