JavaScript kodunu güzelleştirmek için bir toplu komut dosyası yazıyorum. Hem üzerinde çalışması gerekiyor , Windows ve Linux .
Komut satırı araçlarını kullanarak JavaScript kodunu nasıl güzelleştirebilirim?
JavaScript kodunu güzelleştirmek için bir toplu komut dosyası yazıyorum. Hem üzerinde çalışması gerekiyor , Windows ve Linux .
Komut satırı araçlarını kullanarak JavaScript kodunu nasıl güzelleştirebilirim?
Yanıtlar:
Öncelikle, en sevdiğiniz Javascript tabanlı Pretty Print / Beautifier'ı seçin. Ben de olanı tercih ederimhttp://jsbeautifier.org/ , bu ilk ne buldum çünkü. Dosyasını indirir https://github.com/beautify-web/js-beautify/blob/master/js/lib/beautify.js
İkinci olarak, Mozilla grubunun Java tabanlı Javascript motoru Rhino'yu indirin ve yükleyin . "Yükle" biraz yanıltıcıdır; Zip dosyasını indirin, her şeyi çıkarın, js.jar'ı Java sınıf yolunuza (veya OS X'te Kitaplık / Java / Uzantılar) yerleştirin. Daha sonra buna benzer bir çağrı ile komut dosyaları çalıştırabilirsiniz.
java -cp js.jar org.mozilla.javascript.tools.shell.Main name-of-script.js
Javascript dosyanızda okuyacak ve birinci adımdan Pretty Print / Beautifier ile çalıştıracak küçük bir kabuk komut dosyası yazmak için 1. adımdaki Pretty Print / Beautifier'ı kullanın. Örneğin
//original code
(function() { ... js_beautify code ... }());
//new code
print(global.js_beautify(readFile(arguments[0])));
Rhino, javascript'e bir tarayıcı bağlamında mutlaka bir anlam ifade etmeyen, ancak konsol bağlamında işe yarayan birkaç ekstra yararlı işlev sunar. Print işlevi beklediğiniz şeyi yapar ve bir dize yazdırır. ReadFile işlevi bir dosya yolu dizesini bağımsız değişken olarak kabul eder ve bu dosyanın içeriğini döndürür.
Yukarıdakileri şöyle çağırırsınız:
java -cp js.jar org.mozilla.javascript.tools.shell.Main beautify.js file-to-pp.js
Rhino çalıştırma komut dosyalarınızda Java ve Javascript'i karıştırıp eşleştirebilirsiniz, bu nedenle biraz Java biliyorsanız, bunu metin akışlarıyla da çalıştırmak çok zor olmamalıdır.
GÜNCELLEME Nisan 2014 :
Güzelleştirici, 2010 yılında bunu yanıtladığımdan beri yeniden yazıldı. Şimdi orada bir python modülü var, nodejs için bir npm Paketi var ve jar dosyası gitti. Lütfen github.com'daki proje sayfasını okuyun .
Python stili:
$ pip install jsbeautifier
NPM tarzı:
$ npm -g install js-beautify
kullanmak için:
$ js-beautify file.js
Orijinal cevap
@Alan Storm Cevabına Ekleniyor
http://jsbeautifier.org/ tabanlı komut satırı güzelleştiricisinin kullanımı biraz daha kolay hale geldi, çünkü artık (alternatif olarak) rhino (java tabanlı JS motoru, paketlenmiş) yerine V8 javascript motoruna (c ++ kodu) dayanıyor. "js.jar" olarak). Böylece gergedan yerine V8 kullanabilirsiniz.
Nasıl kullanılır:
jsbeautifier.org zip dosyasını http://github.com/einars/js-beautify/zipball/master adresinden indirin
(bu, http://download.github.com/einars-js-beautify-10384df.zip gibi bir zip dosyasına bağlı bir indirme URL'sidir )
eski (artık çalışmıyor, jar dosyası gitti)
java -jar js.jar name-of-script.js
yeni (alternatif)
svn'den v8 lib yükleyin / derleyin, yukarıda belirtilen zip dosyasında v8 / README.txt dosyasına bakın
./jsbeautify somefile.js
Rhino sürümünden biraz farklı komut satırı seçeneklerine sahiptir,
-ve Eclipse'de "Harici Araç" olarak yapılandırıldığında harika çalışıyor
Nodejs kullanıyorsanız uglify- js'yi deneyin
Linux veya Mac'te, halihazırda nodej'lerin kurulu olduğunu varsayarsak, uglify'i şu şekilde kurabilirsiniz:
sudo npm install -g uglify-js
Ve sonra seçenekleri alın:
uglifyjs -h
Yani foo.js
şuna benzeyen bir kaynak dosyam varsa :
// foo.js -- minified
function foo(bar,baz){console.log("something something");return true;}
Bunu şöyle güzelleştirebilirim:
uglifyjs foo.js --beautify --output cutefoo.js
uglify
girinti için boşlukları varsayılan olarak kullanır, bu nedenle 4 boşluk girintisini sekmelere dönüştürmek istersem, unexpand
Ubuntu 12.04'ün geldiği aracılığıyla çalıştırabilirim :
unexpand --tabs=4 cutefoo.js > cuterfoo.js
Veya hepsini tek seferde yapabilirsiniz:
uglifyjs foo.js --beautify | unexpand --tabs=4 > cutestfoo.js
Unexpand hakkında daha fazla bilgiyi burada bulabilirsiniz
tüm bunlardan sonra şöyle görünen bir dosya buluyorum:
function foo(bar, baz) {
console.log("something something");
return true;
}
güncelleme 2016-06-07
Görünüşe göre uglify-js'nin geliştiricisi artık sürüm 2 üzerinde çalışıyor, ancak kurulum aynı.
uglifyjs -b
girintiyi düzeltmekten çok daha fazlasını yapar, kodu yeniden düzenler ve yeniden yazar, belki verimlilik için. İstediğim bu değil. Ubuntu 14.04'te eski bir sürümü kullanıyordum.
uglifyjs -b
Kodun nasıl yeniden düzenlendiğini ve yeniden yazıldığını biraz daha açıklar mısınız?
$ sudo apt install jsbeautifier
$ js-beautify ugly.js > beautiful.js
js-beautify -o file.js file.js
Konsolda Artistic Style'ı (AStyle olarak da bilinir) --mode=java
.
Harika çalışıyor ve ücretsiz, açık kaynaklı ve çapraz platform (Linux, Mac OS X, Windows).
Modern JavaScript yöntemini kullanın:
Kullanım Grunt ile birlikte Grunt için jsbeautifier eklentisi
Npm kullanarak her şeyi geliştirme ortamınıza kolayca yükleyebilirsiniz .
İhtiyacınız olan tek şey, dosya birleştirme, lint, çirkinleştirme, küçültme vb. De içeren uygun görevlerle bir Gruntfile.js kurmak ve grunt komutunu çalıştırmaktır.
Kabul edilen yanıta yorum ekleyemiyorum, bu yüzden ilk etapta var olmaması gereken bir gönderi görüyorsunuz.
Temel olarak, bir java kodunda bir javascript güzelleştiricisine de ihtiyacım vardı ve şaşırtıcı bir şekilde hiçbiri bulabildiğim kadarıyla mevcut değil. Ben de bir tanesini tamamen kabul edilen cevaba göre kodladım (jsbeautifier.org beautifier .js betiğini sarar ancak java veya komut satırından çağrılabilir).
Kod https://github.com/belgampaul/JsBeautifier adresinde bulunmaktadır.
Rhino ve beautifier.js kullandım
Konsoldan KULLANIM: java -jar jsbeautifier.jar komut dosyası girintisi
örnek: java -jar jsbeautifier.jar "function ff () {return;}" 2
Java kodundan KULLANIM: public static String jsBeautify (String jsCode, int indentSize)
Kodu uzatabilirsiniz. Benim durumumda sadece girintiye ihtiyacım vardı, böylece oluşturulan javascript'i geliştirme sırasında kontrol edebildim.
Umarım projenizde size biraz zaman kazandırır.
JavaScript'te 5 dakikadan kısa sürede uygulanan bir komut satırı JavaScript güzelleştiricisinin nasıl oluşturulacağını açıklayan bir makale yazdım . YMMV.
- En son kararlı Rhino'yu indirin ve bir yere açın, örneğin ~ / dev / javascript / rhino
- Yukarıda bahsedilen jsbeautifier.org'dan referans alınan beautify.js dosyasını indirin, ardından bir yere kopyalayın, örneğin ~ / dev / javascript / bin / cli-beautifier.js
Bunu beautify.js'nin sonuna ekleyin (JavaScript'e bazı ek üst düzey özellikler kullanarak):
// Run the beautifier on the file passed as the first argument. print( j23s_beautify( readFile( arguments[0] )));
Aşağıdaki kodu, yürütülebilir bir dosyaya kopyalayıp yapıştırın, örneğin ~ / dev / javascript / bin / jsbeautifier.sh:
#!/bin/sh java -cp ~/dev/javascript/rhino/js.jar org.mozilla.javascript.tools.shell.Main ~/dev/web/javascript/bin/cli-beautifier.js $*
(isteğe bağlı) jsbeautifier.js içeren klasörü PATH'e ekleyin veya zaten orada bulunan bir klasöre taşıyın.
Komut satırı aracını sorduğunuzda, tüm js dosyalarınızı toplu olarak güzelleştirmek istediğinize inanıyorum.
Bu durumda Intellij IDEA (11.5 ile test edilmiştir) bunu yapabilir.
Proje dosyalarınızdan herhangi birini seçmeniz ve ana IDE menüsünde "Kod" -> "Kodu yeniden biçimlendir .." seçeneğini seçmeniz yeterlidir. Ardından iletişim kutusunda "dizindeki tüm dosyalar ..." öğesini seçin ve "enter" tuşuna basın. JVM için yeterince bellek ayırdığınızdan emin olun.
Birkaç tek astar seçeneğiniz var. Npm ile veya npx ile tek başına kullanın .
npx semistandard "js/**/*.js" --fix
npx standard "js/**/*.js" --fix
npx prettier --single-quote --write --trailing-comma all "js/**/*.js"