रेजर का उपयोग कर जावास्क्रिप्ट अस्थायी

क्लाइंट-साइड वेब एप्लिकेशन की बढ़ती जटिलता के कारण, मैं ऐसे टेम्पलेट इंजन रखना चाहता हूं जो क्लाइंट पर सीधे काम करें। और इस तरह के फंड, यह कहा जाना चाहिए, काफी दिखाई दिया। लेकिन जब से मैं आसान तरीकों की तलाश नहीं कर रहा हूं, मैं उन सभी की तरह नहीं हूं, मैंने अपना खुद का लाठी बनाने और आसान गुणों के देवियों के साथ खुद को बनाने का फैसला किया (जैसा कि मैं समझता हूं, अगर यह वाक्यांश पोस्ट में नहीं है तो लोग हबर पर दंडित और प्रतिबंधित हैं)।

और इसलिए मैंने रेजर पर एक जोरदार टाइप्ड टेम्पलेट इंजन बनाने का फैसला किया।

उस्तरा

जो लोग चूक गए, उनके लिए रेजर एक ऐसी सुरुचिपूर्ण मार्कअप भाषा है, जिसमें C # या VB को एम्बेड किया गया है। इसका उपयोग ASP.NET MVC और WebMatrix में किया जाता है।

मैं इसके सभी अद्भुत गुणों को चित्रित नहीं करूंगा, क्योंकि स्कॉट गुथरी ने पहले से ही मेरे लिए किया था , और उन्होंने इसे हेबेरा में स्थानांतरित भी कर दिया था।

महत्वपूर्ण बात यह है कि यह दृढ़ता से टाइप किया गया है और इसमें IntelliSense सहित विज़ुअल स्टूडियो का उत्कृष्ट समर्थन है।

इसके अलावा, के बाद से मैं ASP.NET MVC का उपयोग करके .Net पर वेब परियोजनाओं का विकास कर रहा हूं, और रेजर पर अभ्यावेदन का वर्णन करता हूं, यह मेरे लिए एक आदर्श विकल्प है। इसके अलावा, उचित परिश्रम के साथ, आप कोड को फिर से लिखने से छुटकारा पा सकते हैं - सर्वर पर और क्लाइंट पर समान टेम्प्लेट का उपयोग करें।

MVC के बाहर रेजर का उपयोग करना एक बड़ी समस्या नहीं है , लेकिन यह जो कोड उत्पन्न करता है वह C # है, और हमें जावास्क्रिप्ट की आवश्यकता है। और यहाँ मेरी सहायता के लिए आया था ...

SharpKit

यह अद्भुत उपकरण, किसी कारण से, हैबर द्वारा अनदेखा किया जाता है । यह आपको C # कोड को जावास्क्रिप्ट में बदलने की अनुमति देता है।
उदाहरण के लिए, से

using SharpKit.JavaScript; using SharpKit.jQuery; namespace Namespace { [JsType(JsMode.Global)] public class MyPageClient : jQueryContext { public static void Hello(string name) { J(document.body).append(J("<h1/>").text("Hello, " + name.ToUpper())); } } } 

में बदल जाएगा

 function Hello(name) { $(document.body).append($("<h1/>").text("Hello, " + name.toUpperCase())); }; 

परियोजना की आधिकारिक वेबसाइट पर सहनीय दस्तावेज है। आप ऑनलाइन रूपांतरण के साथ भी खेल सकते हैं।

शार्पिट का भुगतान किया जाता है, लेकिन निश्चित रूप से पैसे के लायक है। ओपन-सोर्स प्रोजेक्ट्स के लिए, आप एक मुफ्त लाइसेंस प्राप्त कर सकते हैं। और वाणिज्यिक लोगों के लिए, आप जावास्क्रिप्ट कोड की 2500 लाइनों को मुफ्त में परिवर्तित कर सकते हैं, जो कभी-कभी पर्याप्त हो सकता है।
वैसे, हालांकि मैं जावास्क्रिप्ट में अच्छी तरह से वाकिफ हूं, मैं लंबे समय से SharpKit का उपयोग कर रहा हूं, और मैं आपको सलाह देता हूं। सभी समान, यह संकलन के स्तर पर सामान्य इंटैलिजेंस, और त्रुटि जाँच के साथ लिखने के लिए बहुत अधिक सुविधाजनक है।

कुछ मैं विचलित हो गया था, लेकिन, जैसा कि आप समझते हैं, यह SharpKit की मदद से था कि रेज़र टेम्प्लेट, जिसे पहले C # में परिवर्तित किया गया था, जावास्क्रिप्ट में बदल दिया गया है।

MSBuild

खैर, इस परियोजना की विधानसभा के दौरान होने के लिए, मैंने MSBuild के माध्यम से पूरी बात को एकीकृत करने का निर्णय लिया, जिसके लिए मैंने कार्य को कार्यान्वित किया।

और अब, मैं इस परियोजना को प्रस्तुत करता हूं

शार्पिट रेजर

हां, मैं किसी मूल नाम के साथ नहीं आया था।

CodePlex पर परियोजना की आधिकारिक साइट
एह, कठिनाई के साथ मुझे अंग्रेजी में विवरण दिया गया था, लेकिन Google अभी भी मुझे नहीं समझता है ।

अब तक केवल स्रोत कोड, डेमो हैं।

और अब और अधिक विस्तार से - कोड के साथ, लेकिन अधिक

ठीक है, हाँ, यह एक केंद्र है, आपको सभी हिम्मत जुटानी होगी। केवल उन लोगों को पढ़ें जिन्होंने अभी तक यह नहीं समझा है कि सब कुछ कैसे लागू किया जाता है।

रेजर के लिए बेस

जब रेजर इंजन कोड को संसाधित करता है, तो यह कुछ इस तरह से होता है

 @inherit MyBase<string[]> <ul> @foreach (var item in Model) { <li>@item</li> } </ul> 

आउटपुट कुछ इस तरह का एक वर्ग उत्पन्न करता है:

 namespace MyNamespace { public class MyView: MyBase<string[]> { public override void Execute() { WriteLiteral("<ul>\r\n"); foreach (var item in Model) { WriteLiteral("\t<li>"); Write(item); WriteLiteral("</li>\r\n"); } WriteLiteral("</ul>"); } } } 

इसलिए, हम आधार वर्ग को ऐसे बनाते हैं कि इसे निष्पादित किया जा सके (निष्पादन विधि), और आउटपुट स्ट्रीम (लिखी गई विधि - लिखी गई विधि, बिना लिखी - लिखी विधि) के डेटा को लिखें।
इसके अलावा, अपनी प्रस्तुति कक्षाओं को सामान्य रूप में संचालित करने के लिए इसे सुविधाजनक बनाने के लिए, हम IRenderingArea इंटरफ़ेस पर भी प्रकाश डालते हैं।
यह पता चला है कि हमारे पास यह है:

 public interface IRenderingArea { [JsProperty(NativeField = false)] object Model { get; set; } [JsProperty(NativeField = false)] string Result { get; } void Execute(); } public interface IRenderingArea<T>: IRenderingArea { [JsProperty(NativeField = false)] new T Model { get; set; } } 

यहां इंटरफेस तुरंत एक टाइप किए गए और अनछुए विकल्प के साथ हैं। JsProperty का उपयोग करते हुए यह चिह्नित है कि SharpKit परिणाम फ़ील्ड में नहीं, बल्कि get_Result () फ़ंक्शन में बदल जाता है। तो मुश्किल युद्धाभ्यास के लिए अधिक स्थान होगा।
खैर, बेस क्लास ही ऐसा होगा:

 [JsType(JsMode.Prototype)] public abstract class HtmlArea<T>: JsContext, IRenderingArea<T> { private string _result = ""; public string Result { get { return _result; } } [JsField(Export = false)] private T _model; public T Model { get { return _model; } set { _model = value; } } [JsProperty(Export = false)] object IRenderingArea.Model { get { return Model; } set { Model = value.As<T>(); } } protected virtual void Write(object value) { if (value != null) _result += EscapeValue(value.As<JsObject>().toString()); } protected virtual string EscapeValue(JsString value) { return value .replace("&", "&amp;") .replace("<", "&lt;") .replace(">", "&gt;") .replace("\"", "&quot;") .replace("'", "&#39;"); } protected virtual void WriteLiteral(string value) { _result += value; } public abstract void Execute(); } 

जैसा कि आप देख सकते हैं, यहां वर्ग को जावास्क्रिप्ट में उपयोग करने के लिए अनुकूलित किया गया है।
कई विशेष वर्णों की जगह को स्पष्ट रूप से बदलकर परिरक्षण किया जाता है।

संदर्भ के लिए विशुद्ध रूप से, मैं परिणामी जावास्क्रिप्ट को उद्धृत करता हूं:

 /*Generated by SharpKit v4.24.9000*/ if(typeof(XWeb) == "undefined") XWeb = {}; if(typeof(XWeb.SharpKit) == "undefined") XWeb.SharpKit = {}; if(typeof(XWeb.SharpKit.Razor) == "undefined") XWeb.SharpKit.Razor = {}; XWeb.SharpKit.Razor.AreaExtensions = function() { }; XWeb.SharpKit.Razor.AreaExtensions.Execute = function(view,model) { var area=view(); if(typeof(model) != "undefined") area.set_Model(model); area.Execute(); return area.get_Result(); }; XWeb.SharpKit.Razor.HtmlArea = function() { this._result = ""; }; XWeb.SharpKit.Razor.HtmlArea.prototype.get_Result = function() { return this._result; }; XWeb.SharpKit.Razor.HtmlArea.prototype.get_Model = function() { return this._model; }; XWeb.SharpKit.Razor.HtmlArea.prototype.set_Model = function(value) { this._model = value; }; XWeb.SharpKit.Razor.HtmlArea.prototype.Write = function(value) { if(value != null) this._result += this.EscapeValue(value.toString()); }; XWeb.SharpKit.Razor.HtmlArea.prototype.EscapeValue = function(value) { return value.replace("&","&amp;").replace("<","&lt;").replace(">","&gt;").replace("\"","&quot;").replace("'","&#39;"); }; XWeb.SharpKit.Razor.HtmlArea.prototype.WriteLiteral = function(value) { this._result += value; }; 

अब, ताकि अभ्यावेदन के प्राप्त वर्ग चलाए जा सकें, और उनसे परिणाम प्राप्त कर सकें, कुछ तंत्र की आवश्यकता है।
सबसे पहले, आपको यह तय करने की आवश्यकता है कि टेम्पलेट को चलाने के लिए हमें कौन सी जानकारी की आवश्यकता है। नाम से टेम्प्लेट का उल्लेख करना संभव है, लेकिन किसी तरह यह हमारे जोरदार टाइप सी # दुनिया में कोषेर नहीं है। इसलिए, मैंने फैसला किया कि मुझे सिर्फ टेम्पलेट की एक आवृत्ति बनाने के बारे में जानकारी की आवश्यकता है। यानी एक टेम्पलेट बनाने के लिए कार्य करता है और टेम्पलेट के बारे में जानकारी होगी। और फिर, टेम्पलेट शुरू करने के लिए, हम एक विशेष एक्सटेंशन जोड़ते हैं:

 [JsType(JsMode.Prototype)] public static class AreaExtensions { [JsMethod(OmitOptionalParameters = true)] public static string Execute<T>(this Func<IRenderingArea<T>> view, T model = default(T)) { var area = view(); if (JsContext.JsTypeOf(model) != JsTypes.undefined) area.Model = model; area.Execute(); return area.Result; } } 

यह एक्सटेंशन बस टेम्पलेट का एक उदाहरण बनाता है, मॉडल स्थापित करता है, परिणाम शुरू करता है और पुनः प्राप्त करता है।

कक्षा सृजन

अगला, रेजर इंजन खेल में आता है, जिसे एक टेम्पलेट वर्ग उत्पन्न करना चाहिए।
यहाँ सब कुछ काफी सरल है:

ओह-वह! हेबर अब लिखने की अनुमति नहीं देता है। इसलिए इंतजार जारी रखें।