मैं अपने टाइपप्रति मॉड्यूल के लिए jQuery एएमडी मॉड्यूल की आवश्यकता है। उदाहरण के लिए मान लीजिए कि स्क्रिप्ट के लिए निर्देशिका संरचना इस तरह दिखता है:
jQuery-1.8.2.js
jquery.d.ts
module.ts
require.js
मैं की आवश्यकता के लिए require.js के माध्यम से jQuery-1.8.2.js लोड किया जा module.ts से उत्पन्न js फ़ाइल चाहते हैं।
वर्तमान में मेरे पास है:
आयात jQuery = मॉड्यूल ( 'jQuery')
इस परिणाम में नाम jQuery वर्तमान दायरे में मौजूद नहीं है।
ऐसा लगता है कि मानक फिर से बदल रहा है, जहां नीचे 0.9+ पद्धति अभी भी काम करता है, लेकिन आने वाले ES6 साथ निम्नलिखित मॉड्यूल लोड हो रहा है इस्तेमाल किया जा सकता लग रहा है। (संदर्भ: https://github.com/TypeStrong/atom-typescript/issues/237#issuecomment-90372105 )
import * as $ from "jquery";
और यहां तक कि आंशिक वाले
import {extend} from "jquery";
(यह अभी भी अगर tsd स्थापित किया गया है, jquery.d.ts आवश्यकता होती है - tsd install jquery)
tsd स्थापित करने के लिए: npm install tsd -g
/// <reference path="../../typings/jquery/jquery.d.ts" />
import $ = require('jquery');
//Do your stuff
और यह भी, यदि आपका jquery.d.ts एक बाहरी मॉड्यूल को परिभाषित नहीं है, जोड़ने jquery.d.ts के लिए निम्न:
declare module "jquery" {
export = $;
}
मुझे लगता है कि यह चारों ओर भ्रम का एक बहुत jQuery वास्तव में एक बाहरी मॉड्यूल है, जो एक के उपयोग को रोकता है की तरह अभिनय नहीं की वजह से है importबयान। समाधान काफी स्पष्ट, आसान और काफी की तरह एक काम के आसपास महसूस नहीं करने के लिए सुरुचिपूर्ण है।
मैं का एक सरल उदाहरण ऊपर लिखा है टाइपप्रति में RequireJS और jQuery का उपयोग करते हुए , जो इस प्रकार काम करता है ...
आप से प्रकार परिभाषाएं हड़पने निश्चित रूप से लिखे गए RequireJS और jQuery के लिए।
अब आप टाइपप्रति फ़ाइल के अंदर स्थिर टाइपिंग के साथ कच्चे RequireJS उपयोग कर सकते हैं।
app.ts
///<reference path="require.d.ts" />
///<reference path="jquery.d.ts" />
require(['jquery'], function ($) {
$(document).ready(() => {
alert('Your code executes after jQuery has been loaded.');
});
});
और फिर आप केवल अपने पृष्ठ के लिए एकल स्क्रिप्ट टैग को जोड़ने की जरूरत है:
<script data-main="app" src="require.js"></script>
अन्य समाधान से अधिक लाभ?
.d.tsके लिए फाइल)import $ = module("jquery");
declare module "jquery" {
export function (selector: string, context?: any): JQuery;
export function (element: Element): JQuery;
export function (object: { }): JQuery;
export function (elementArray: Element[]): JQuery;
export function (object: JQuery): JQuery;
export function (func: Function): JQuery;
export function (): JQuery;
}
requirejs.config({
paths: {
'jquery': 'js/jquery-1.8.2.min'
}
});
सबसे पहले (पाने की आवश्यकता होती है-jQuery आधिकारिक GitHub रेपो से)। इस के बाद अपने निर्देशिका तरह दिखेगा:
require-jquery.js
jquery.d.ts
main.ts
main.js
test.html
वर्तमान में टाइपप्रति पर JQuery और एएमडी मॉड्यूल के साथ काम करने के लिए सबसे आसान तरीका है main.ts पर निम्नलिखित लिखने के लिए है:
///<reference path="jquery.d.ts" />
declare var require;
require(["jquery"], function($:JQueryStatic) {
$('body').append('<b>Hello JQuery AMD!</b>');
});
और यह आपके test.html से कहते हैं:
<!DOCTYPE html>
<html>
<head>
<script data-main="main" src="require-jquery.js"></script>
</head>
<body>
<h1>TypeScript JQuery AMD test</h1>
</body>
</html>
उम्मीद है की यह मदद करेगा!
आप पथ और फ़ाइल नाम (ऋण .js विस्तार) द्वारा बाहरी मॉड्यूल संदर्भ, या सिर्फ फ़ाइल नाम से अगर वे वैश्विक हैं। आपके मामले में, आप module.ts के अंदर इस करना चाहिए:
import jquery = module('./jquery-1.8.2');
साथ संकलित करने के लिए याद रखें --module AMDक्योंकि डिफ़ॉल्ट रूप से आप कोड commonjs का उपयोग करता है मिलेगा requireकार्य करते हैं।