2017-08-01 30 views
5

पर छोटे एसडीके बनाएं टाइपस्क्रिप्ट में लिखी गई छोटी एसडीके लाइब्रेरी बनाने की कोशिश कर रहा हूं। मेरा विचार परियोजना है कि कई ts फ़ाइलें जो एक js के संकलन में शामिल होगा बनाने के लिए है और मेरे पुस्तकालय foo.bar.myPublicClassesटाइपस्क्रिप्ट के साथ एक जेएस फ़ाइल

की तरह उपयोग कर सकते हो सकता है

सबसे बड़ी टिप्पणी मैं सरल HTML पृष्ठों पर इसका इस्तेमाल नहीं करना चाहते हैं, मेरा पर्यावरण डायनेमिक्स सीआरएम है, इसलिए जावास्क्रिप्ट सहित सामान्य एचटीएमएल स्क्रिप्ट में नहीं किया गया है टैग, और लोडिंग जावास्क्रिप्ट डायनेमिक्स सीआरएम के निर्माण ढांचे के साथ एसिंक्रोनस में किया जाता है। इसलिए मुझे अपनी लाइब्रेरी को एक फाइल में बंडल करने की ज़रूरत है। तो संक्षेप में मुझे एक बंडल जेएस फ़ाइल की आवश्यकता है, बिना किसी निर्भरता के d.ts फ़ाइल के साथ, इसलिए इसे अन्य टाइपस्क्रिप्ट फ़ाइलों पर पुन: उपयोग किया जा सकता है। मेरी जे एस कोड डायनेमिक्स सीआरएम से मैं किसी भी वैश्विक समारोह की जरूरत को चलाने के लिए अतिरिक्त, मेरे दृष्टिकोण वर्ग foo.bar.mylibrary.sdk.create() पर कुछ स्थिर समारोह होगा

मेरे परियोजना संरचना ऐसी लग सकता है:

 

src/ 
|-bundle.ts 
|-classes/ 
| |-classA.ts 
| |-classB.ts 
| 
|-interfaces/ 
| |-IInterface1.ts 
| -IInterface2.ts 
| 
|-Helpers/ 
| |-HelperA.ts 
| |-HelperA.ts 
| 
dist/ 
| -myLibrary.js 

मैं और अधिक .ts फ़ाइलों के लिए की तरह मैं अपने सी # कोड वर्ग आदि

संस्करण प्रति एक फ़ाइल लिखते थे 1 मेरे प्रारंभिक दृष्टिकोण नाम स्थान का उपयोग किया गया है, लेकिन मैं अगर यकीन नहीं चाहते हैं परियोजना के लंबे समय तक इसे करने का सबसे अच्छा तरीका होगा। कि apporach में मैं अपने नाम स्थान में सभी ts फ़ाइलें लिखने मेरे लिए केवल एक ही बुरा गंध js संयुक्त फ़ाइल में प्रत्येक टीएस कि फ़ाइल लिखने

//a.ts 
namespace foo.bar.mylibrary{ 
    class a { 
     isOk:boolean; 
    } 
    export class b { 
     constructor(){ 
      let test = new a(); 
      test.isOk = false; 
     } 
    } 
} 
//b.ts 
namespace foo.bar.mylibrary{ 
    export class sdk{ 
     public isStart:boolean; 
     public static Create(){ 
      //initialize my sdk 
     } 
    } 
} 

संकलन

"use strict"; 
// b.ts 
var foo; 
(function (foo) { 
    var bar; 
    (function (bar) { 
     var mylibrary; 
     (function (mylibrary) { 
      var a = (function() { 
       function a() { 
       } 
       return a; 
      }()); 
      var b = (function() { 
       function b() { 
        var test = new a(); 
        test.isOk = false; 
       } 
       return b; 
      }()); 
      mylibrary.b = b; 
     })(mylibrary = bar.mylibrary || (bar.mylibrary = {})); 
    })(bar = foo.bar || (foo.bar = {})); 
})(foo || (foo = {})); 
var foo; 
(function (foo) { 
    var bar; 
    (function (bar) { 
     var mylibrary; 
     (function (mylibrary) { 
      var sdk = (function() { 
       function sdk() { 
       } 
       sdk.Create = function() { 
        //initialize my sdk 
       }; 
       return sdk; 
      }()); 
      mylibrary.sdk = sdk; 
     })(mylibrary = bar.mylibrary || (bar.mylibrary = {})); 
    })(bar = foo.bar || (foo.bar = {})); 
})(foo || (foo = {})); 

हो सकता है कि वहाँ के लिए बेहतर तरीका है करने के लिए होता है उन ts फ़ाइलों को संकलित करें। commonjs, outputfile - -

मेरी tsconfig मॉड्यूल शामिल टाइपप्रति प्रलेखन यह अब बेहतर होगा बाहरी मॉड्यूल का उपयोग करने के अनुसार myLibrary.js

संस्करण 2 , लेकिन मुझे यकीन है कि अगर संकलित js है नहीं कर रहा हूँ क्या मैं नहीं देखूंगा कि निर्यात किए गए वर्ग सरल var ऑब्जेक्ट में संकलित किए गए हैं और निर्यात की गई श्रेणी परिभाषित कार्यों में हैं।

//a.ts 
    class a { 
     isOk:boolean; 
    } 
    export class b { 
     constructor(){ 
      let test = new a(); 
      test.isOk = false; 
     } 
    } 

//b.ts 

    export class sdk{ 
     public isStart:boolean; 
     public static Create(){ 
      //initialize my sdk 
     } 
    } 
//build.ts 
export {sdk} from "./src/b"; 

define(["require", "exports", "./src/classb"], function (require, exports, classb_1) { 
    "use strict"; 
    function __export(m) { 
     for (var p in m) if (!exports.hasOwnProperty(p)) exports[p] = m[p]; 
    } 
    Object.defineProperty(exports, "__esModule", { value: true }); 
    // export * from "./src/classa"; 
    __export(classb_1); 
}); 

के संकलन और फिर मैं अपने आवश्यक मॉड्यूल बंडल करने की जरूरत है, लेकिन मैं कैसे उचित तरीके से यह करने के लिए पता नहीं है। एएमडी outputfile - -

मेरी tsconfig मॉड्यूल शामिल myLibrary.js

मैं अपने पुस्तकालय मैं घूंट चाहिए या कुछ अन्य टूलकिट पूरा करने के लिए मान लेते हैं, लेकिन किसी को भी मुझे कुछ संकेत या कैसे यह करने के लिए दे सकते हैं?

+0

अपने output.js फ़ाइल है एक गतिशीलता सीआरएम प्रपत्र पर लोड किया जा रहा क्लाइंट साइड या यह नोड के माध्यम से सर्वर साइड चल रहा है (या अन्य)? –

+0

केवल क्लाइंट-साइड – ANDyW

उत्तर

0

यह मेरा tsconfig.json है और यह केवल एक ही js को transpiles फ़ाइल

{ 
    "compilerOptions": { 
    "module": "amd", 
    "target": "es5", 
    "sourceMap": true, 
    "outFile": "../public/js/yourfile.js" 
    }, 
    "exclude": [ 
    "node_modules", 
    "typings" 
    ] 
} 
+0

पर जैसा कि मैंने अपने प्रश्न में लिखा है और उदाहरण पोस्ट किया है, मुझे पता है कि tsconfig के साथ एक जेएस में टीएस को कैसे संकलित करना है, लेकिन जब मैं नेमस्पेस का उपयोग करता हूं तो यह संस्करण 1 के साथ लगभग सही काम करता है, बाहरी मॉड्यूल के साथ इसे केवल निर्यात करने के लिए संकलित किया जाता है कक्षा परिभाषित करने के रूप में। – ANDyW

संबंधित मुद्दे