Murat Uysal - JavascriptMatematik Mühendisi - Yazılım Geliştirme Uzmanı
http://www.muratuysal.com.tr/
http://www.rssboard.org/rss-specificationBlogEngine.NET 2.9.1.0tr-TRhttp://www.muratuysal.com.tr/opml.axdhttp://www.dotnetblogengine.net/syndication.axdMurat UysalMurat Uysal0.0000000.000000LessCss Dinamik Olarak IIS üzerinde kullanımıÖncelikle LessCss'i indiriyoruz. aşağıdaki resimde görülen linke tıklayıp LessCss son versiyonu indiriyoruz.<div><a href="http://lesscss.org/#download-options">http://lesscss.org/#download-options</a></div><img src="/FILES%2f2014%2f07%2flessdownload.png"><div>Ben dosyayı "less.js" olarak kayıt ettim.</div><div><br></div><div>Daha sonra html sayfamı hazırlıyorum. Aşağıdaki sayfada öncelikle still.less i sonra ise less.js dosyalarını sayfaya ekliyorum</div><div><br></div><img src="/FILES%2f2014%2f07%2fless-css-html-ornek-sayfa.png"><div><br></div><div>Artık stil.less dosyamızda less css kodlarımızı yazabiliriz.</div><div><br></div><img src="/FILES%2f2014%2f07%2fstill-less-dosyasi.png"><div><br></div><div>Yukarıdaki yapıyı hazırladıktan sonra dosyalarımızın görünümü şu şekilde oluyor.</div><div><br></div><img src="/FILES%2f2014%2f07%2fless-css-dosyalarin-gorunumu.png"><div>Bu dosyaları site üzerine yükledim ancak çalışmadığını görüyoruz.</div><div><br></div><img src="/FILES%2f2014%2f07%2fless-css-site-test.png"><div>İşte bu noktada sebebini öğrenmek isterseniz zaten size tarayıcının konsol ekranı yardımcı oluyor. Aşağıdaki ekranda ilgili dosya sunucuya yüklemiş olmasına rağmen .less uzantısının olmadığını söylüyor.</div><img src="/FILES%2f2014%2f07%2fless-css-less-uzantisi-iis-sorunu.png"><div><br></div><div>Bu hatanın sebebi IIS üzerinde mime type olarak .less uzantısının tanımlanmamasıdır.İlgili adrese gittiğinizde o dosya hiç yokmuş gibi 404 hatası verecektir.</div><div><br></div><img src="/FILES%2f2014%2f07%2fless-dosyasinin-404-hatasi-vermesi.png"><div><br></div><div>Mime type iis yönetim arayüzünün ana sayfasında "Mime Types" şeklinde bir menü var. Bu menüden açılan ekranda sağ bölümdeki Add butonu ile aşağıdaki şekilde ekliyoruz.</div><div><br></div><img src="/FILES%2f2014%2f07%2fless-uzantisi-mime-type.png"><div><br></div><div>Tanımladığımız anda az önce 404 hatası veren sayfada aşağıdaki gibi artık içeriğini görebilir durumdayız.</div><div><br></div><img src="/FILES%2f2014%2f07%2fless-dosyasinin-mime-ayari-sonrasi.png"><div><br></div><div>Ve artık aşağıdaki gibi html sayfamıza gittiğinizde stil.less dosyamızın çalıştığını görebiliyoruz.</div><div><br></div><div><a href="http://www.muratuysal.com.tr/test/lesscss/">http://www.muratuysal.com.tr/test/lesscss/</a><br></div><div><br></div><div><br></div><img src="/FILES%2f2014%2f07%2fless-css-kullanimi.png"><div><br></div><div>Bu şekilde projenizde lessCss i dinamik olarak kullanabilirsiniz. </div><div><br></div><div>Not: Performans gerektiren uygulamalarda getirdiği yük test edilmelidir. Sonuçta ilgili less.js dosyası 100KB boyutundadır ve her tarayıcı isteğinde ilgili stil.less dosyasından gerçek css kodlarına geçişin sağlanması nedeniyle statik bir css dosyasından daha yavaş çalışacaktır.</div><div><br></div><div>Örnekte kullandığım dosyaları aşağıdaki linkten indirebilirsiniz.</div><a href="http://www.muratuysal.com.tr/FILES%2f2014%2f07%2flessCss.rar">lessCss.rar (30,8KB)</a><div><br></div><div>iyi çalışmalar.</div>
http://www.muratuysal.com.tr/post/lesscss-dinamik-olarak-iis-uzerinde-kullanimi
[email protected]http://www.muratuysal.com.tr/post/lesscss-dinamik-olarak-iis-uzerinde-kullanimi#commenthttp://www.muratuysal.com.tr/post.aspx?id=67527df2-3f56-4969-bb44-0c4b37a3f4f9Fri, 04 Jul 2014 23:07:00 +0300CSSJavascriptmurat.uysalhttp://www.muratuysal.com.tr/pingback.axdhttp://www.muratuysal.com.tr/post.aspx?id=67527df2-3f56-4969-bb44-0c4b37a3f4f90http://www.muratuysal.com.tr/trackback.axd?id=67527df2-3f56-4969-bb44-0c4b37a3f4f9http://www.muratuysal.com.tr/post/lesscss-dinamik-olarak-iis-uzerinde-kullanimi#commenthttp://www.muratuysal.com.tr/syndication.axd?post=67527df2-3f56-4969-bb44-0c4b37a3f4f9