JavaScript'in Sesini Açma / Açma Aracı [kapalı]

430

Tidy'in korkunç HTML'yi nasıl temizleyebileceğine benzer şekilde, küçültmenin etkilerini tersine çevirebilecek herhangi bir komut satırı komut dosyası ve / veya çevrimiçi araç var mı?

(Özellikle küçültülmüş bir JavaScript dosyasını küçültmek istiyorum, bu nedenle değişken yeniden adlandırma hala bir sorun olabilir.)

javascript  code-formatting  minify  compression  unminify 
— Andy Ford
kaynak
4
Farkında olmayanlarınız için, küçültme iç değişken adlarını tek bir harfe dönüştürür ve kod yorumlarını kaldırır. Bu değişikliklerin geri alınması otomatikleştirilemez.
— Vivian River
@DanielAllenLangdon İyi bir nokta. Sorguları düzenledim, böylece artık küçültmenin değişken adlarını değiştirmediği anlamına gelmiyor.
— Andy Ford
12
FWIW ... az önce JS NICE jsnice.org
— Andy Ford
marcusjenkins.com/linux/… benim için iyi çalıştı.
— 15'te
1
@DanielAllenLangdon için: jsnice.org 30k angularjs kodunu bile yok edebilir ve gizliliğini kaldırabilir.
— Yeşil

Yanıtlar:

504

Bunu kullanabilirsiniz: http://jsbeautifier.org/ Ancak kullandığınız küçültme yöntemine bağlıdır, bu yalnızca kodu biçimlendirir, değişken adlarını değiştirmez veya base62 kodlamasını sıkıştırmaz.

edit: aslında "paketlenmiş" komut dosyalarını (Dean Edward'ın packer ile paketlenmiş olabilir: http://dean.edwards.name/packer/ )

— Fabien Ménager
kaynak
2
+1 - Bu yöntemi daha önce kullandım ve jsbeautifier.org mükemmel bir hizmettir.
— Dan Lew
Teşekkürler. Tam da aradığım şey buydu.
— Andy Ford
5
— Fabien Ménager
4
"değişken adlarını değiştirir" ve kod kırmak için hala JS sözdizimi farkında bir araç gibi bir şey var mı?
— Jorge Vargas
3
yapabilseydim bu 10 kat yukarı olurdu. Beni boşa harcanan bir günden kurtardı!
— benlumley
154

Chrome geliştirici araçları bu özelliğe sahiptir. Geliştirici araçlarını açın (F12 tuşuna basmanın bir yolu vardır), Kaynaklar sekmesinde sol alt çubukta bir dizi simge bulunur. "{}" Simgesi "Oldukça basılı" ve bu dönüşümü istek üzerine yapıyor.

GÜNCELLEME: IE9 "F12 geliştirici araçları" da Komut Dosyası sekmesinde Araçlar simgesinin altındaki bir "JavaScript Biçimlendir" özelliğine sahiptir. ( bkz . F12'deki İpucu # 4 En iyi saklanan web hata ayıklama sırrı )

resim açıklamasını buraya girin

— Jon Adams
kaynak
1
Küçültmeye çalıştığım .js için bu yöntem en iyi şekilde çalıştı, şerefe.
— igneosaur
1
Bu artık Komut Dosyaları sekmesinde değil, "Kaynaklar" sekmesinde bulunmaktadır.
— mhenry1384
@ mhenry1384: Evet, Chrome sekmeyi yeniden adlandırdı. Cevabı buna göre güncelledim.
— Jon Adams
EVET!! (bizim app farkında olduğum js için bir hata ayıklama / dev modu yok - biz neyse ki değişken adları kısaltmak / dönüştürmüyoruz.)
— Steven Lu
2
Yalnızca bir başlık: Chrome bazen JavaScript kodunu karıştırır. Örneğin , bir sözdizimi hatası olduğu if (a) /regex/.match(foo);gibi güzel yazdırılır if (a)\n / /regex/ .\nmatch(foo);.
— amfetamin
56

Anladım! JSBeautifier tam olarak bunu yapar ve otomatik biçimlendirme için seçenekleriniz bile vardır.

— Flaş
kaynak
5
google-then-stackoverflow yerine stackoverflow-sonra-google? :))))
— dfa
"Çevrimiçi javascript formatter" için google yaptım
— cgp
1
Sonra FireBug en js ayıklayıcısında hatlarında kesme noktaları ayarlayabilirsiniz böylece bu FireFox eklentisi un-küçültmek javascript JSBeautifier kullanır !!: addons.mozilla.org/en-US/firefox/addon/javascript-deminifier
— BT
14

Firefox, SpiderMonkey ve Rhino'da, herhangi bir kodu anonim bir işleve sarabilir ve toSourceyöntemini çağırabilirsiniz , bu da size işlevin güzel biçimlendirilmiş bir kaynağını verir.

toSource Ayrıca yorumlar şeritler.

Örneğin. :

(function () { /* Say hello. */ var x = 'Hello!'; print(x); }).toSource()

Bir dizeye dönüştürülecek:

function () {
    var x = "Hello!";
    print(x);
}

Not : Bu bir "çevrimiçi araç" değil, ancak genel güzelleştirme teknikleriyle ilgili tüm sorular bunun kopyası olarak kapalı.

— katspaugh
kaynak
İlginç. Soruyu 2.5 yıl önce sordum, bu yüzden başlığı düzenlemek için çok geç hissediyorum, ancak yine de hem çevrimiçi hem de çevrimdışı seçenekleri görmeyi seviyorum. Chiming için teşekkürler. +1
— Andy Ford
10

Mac ve TextMate'iniz varsa - Javascript'i biçimlendirmek için kolay bir alternatif:

  1. Dosyayı Textmate ile açın.
  2. > Paketler> JavaScript> Belgeyi Yeniden Biçimlendir'i tıklayın.
  3. Bir bira açmak çatlamak.
— Taş
kaynak
2
Bira şu anda servis ediliyor :)
— dgilperez
6

IDE'lerin çoğu otomatik biçimlendirme özellikleri de sunar. Örneğin NetBeans'te CTRL + K tuşlarına basmanız yeterlidir .

— gou1
kaynak
5

Alternatif olarak (şimdiye kadar jsbeautifier.org'u bilmediğim için), Dean Edward'ın Packer'daki kod çözme düğmesini yeniden etkinleştiren bir yer imi kullandım.

Talimatları ve yer imini burada buldum .

İşte yer işareti (sitenin kapalı olması durumunda)

javascript:for%20(i=0;i<document.forms.length;++i)%20{for(j=0;j<document.forms[i].elements.length;++j){document.forms[i].elements[j].removeAttribute(%22readonly%22);document.forms[i].elements[j].removeAttribute(%22disabled%22);}}
— Mottie
kaynak
5

Stone'un cevabına benzer , ancak Windows / .NET geliştiricileri için:

Visual Studio ve ReSharper - Javascript formatlamak için kolay bir alternatif varsa:

  • Dosyayı Visual Studio ile açın;
  • Yeniden Paylaşım> Araçlar> Temizleme Kodu'nu (Ctrl + E, C) tıklayın;
  • "Varsayılan: Kodu yeniden biçimlendir" i seçin ve Tamam'ı tıklayın;
  • Bir bira açmak çatlamak.
— Augusto Proiete
kaynak
4

Güzel bir milden uzak olmasına rağmen, JSPretty javascript kaynak kodlarını insan tarafından okunabilir yapmak için iyi, ücretsiz ve çevrimiçi bir araçtır. Tercih ettiğiniz girinti türünü zorlayabilir ve aynı zamanda gizlemeyi de tespit edebilir.

— Farshid
kaynak
Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.