React ile İzomorfik Bir Projeye Koşullu Script Eklemek

React ile İzomorfik Bir Projeye Koşullu Script Eklemek

Bazen kolay diye düşündüğümüz şeyler başlangıçta düşünülenden daha karmaşık görünür. Örneğin, bugün yazdığım bir koda eklemek zorunda olduğum IE koşullu script. Sadece internet explorer’da çalışacak bir javascript olan html5Shiv’i bilmeyeniniz yoktur. Html5 özelliklerini internet explorer’da da kullanabilmek için bu scripti sadece ie’de çalışacak şekilde eklemelisiniz. Kod şu şekilde,

Ancak inşa ettiğimiz React.js ve izomorfik SPA nedeniyle işler biraz daha karmaşık görünüyor. HTML comment olarak jsx içerisine kod yazmanın tek yolu react.js’in dangerouslySetInnerHTML özelliğini kullanmak.

Script tagini açıp kapatmadan “<script src=’xxx’ />” şeklinde kapatırsanız React hata verecektir. Bu yüzden tagi açıp kapatmanız gerekiyor. En önemli sorun ise <head> içerisinde birden fazla script, meta gibi taglerden varsa bu çalışmayacaktır. Tabii ki bütün html dizesini dangerouslySetInnerHTML içine koyabilirsin, ama bu çok semantic olmayacaktır ve proje build edilirken sürekli warning alabilirsin.

Bu yüzden browserın html yorumlama açıklarını kötüye kullandım ve koşullu scripti şu an mükemmel çalışan <meta> etiketinin içine yerleştirdim.

, , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , ,

About Bir Frontendci

Lead FrontEnd Developer, React - Node.js - Html - Css Blogger, Geology Engineer, Gamer, Foosball Player, A True Car Enthusiast..
View all posts by Bir Frontendci →

Bir Cevap Yazın

E-posta hesabınız yayımlanmayacak.