Saya menulis skrip batch untuk mempercantik kode JavaScript. Ini perlu bekerja pada Windows dan Linux .
Bagaimana cara mempercantik kode JavaScript menggunakan alat baris perintah?
Saya menulis skrip batch untuk mempercantik kode JavaScript. Ini perlu bekerja pada Windows dan Linux .
Bagaimana cara mempercantik kode JavaScript menggunakan alat baris perintah?
Jawaban:
Pertama, pilih Pretty Print / Beautifier berbasis Javascript favorit Anda. Saya lebih suka yang dihttp://jsbeautifier.org/ , karena itulah yang saya temukan pertama kali. Unduh filenya https://github.com/beautify-web/js-beautify/blob/master/js/lib/beautify.js
Kedua, unduh dan instal mesin Javascript berbasis Java milik Grup Mozilla, Rhino . "Instal" agak menyesatkan; Unduh file zip, ekstrak semuanya, tempatkan js.jar di jalur kelas Java Anda (atau Library / Java / Extensions di OS X). Anda kemudian dapat menjalankan skrip dengan pemanggilan yang mirip dengan ini
java -cp js.jar org.mozilla.javascript.tools.shell.Main name-of-script.js
Gunakan Pretty Print / Beautifier dari langkah 1 untuk menulis skrip shell kecil yang akan dibaca di file javascript Anda dan jalankan melalui Pretty Print / Beautifier dari langkah pertama. Sebagai contoh
//original code
(function() { ... js_beautify code ... }());
//new code
print(global.js_beautify(readFile(arguments[0])));
Rhino memberikan beberapa fungsi tambahan yang berguna pada javascript yang tidak selalu masuk akal dalam konteks browser, tetapi dilakukan dalam konteks konsol. Fungsi print melakukan apa yang Anda harapkan, dan mencetak string. Fungsi readFile menerima string jalur file sebagai argumen dan mengembalikan konten file itu.
Anda akan meminta sesuatu seperti di atas
java -cp js.jar org.mozilla.javascript.tools.shell.Main beautify.js file-to-pp.js
Anda dapat mencampur dan mencocokkan Java dan Javascript di skrip yang dijalankan Rhino, jadi jika Anda tahu sedikit tentang Java, seharusnya tidak terlalu sulit untuk menjalankannya dengan aliran teks juga.
UPDATE April 2014 :
Beautifier telah ditulis ulang sejak saya menjawab ini pada tahun 2010. Sekarang ada modul python di sana, Paket npm untuk nodejs, dan file jar hilang. Silakan baca halaman proyek di github.com .
Gaya Python:
$ pip install jsbeautifier
Gaya NPM:
$ npm -g install js-beautify
untuk menggunakannya:
$ js-beautify file.js
Jawaban asli
Menambah Answer dari @Alan Storm
beautifier baris perintah berdasarkan http://jsbeautifier.org/ telah menjadi sedikit lebih mudah digunakan, karena sekarang (alternatif) didasarkan pada mesin javascript V8 (kode c ++) bukan rhino (mesin JS berbasis java, dikemas sebagai "js.jar"). Jadi Anda bisa menggunakan V8 sebagai pengganti badak.
Cara Penggunaan:
unduh file zip jsbeautifier.org dari http://github.com/einars/js-beautify/zipball/master
(ini adalah URL unduhan yang ditautkan ke file zip seperti http://download.github.com/einars-js-beautify-10384df.zip )
lama (tidak lagi berfungsi, file jar hilang)
java -jar js.jar name-of-script.js
baru (alternatif)
instal / kompilasi v8 lib DARI svn, lihat v8 / README.txt di file zip yang disebutkan di atas
./jsbeautify somefile.js
-memiliki opsi baris perintah yang sedikit berbeda dari versi badak,
-dan berfungsi dengan baik di Eclipse jika dikonfigurasi sebagai "Alat Eksternal"
Jika Anda menggunakan nodejs, coba uglify-js
Di Linux atau Mac, dengan asumsi Anda sudah menginstal nodejs, Anda dapat menginstal uglify dengan:
sudo npm install -g uglify-js
Dan kemudian dapatkan opsi:
uglifyjs -h
Jadi jika saya memiliki file sumber foo.js
yang terlihat seperti ini:
// foo.js -- minified
function foo(bar,baz){console.log("something something");return true;}
Saya bisa mempercantiknya seperti ini:
uglifyjs foo.js --beautify --output cutefoo.js
uglify
menggunakan spasi untuk lekukan secara default jadi jika saya ingin mengubah lekukan 4-spasi ke tab, saya dapat menjalankannya melalui unexpand
Ubuntu 12.04 yang dilengkapi dengan:
unexpand --tabs=4 cutefoo.js > cuterfoo.js
Atau Anda dapat melakukan semuanya sekaligus:
uglifyjs foo.js --beautify | unexpand --tabs=4 > cutestfoo.js
Anda dapat mengetahui lebih lanjut tentang unexpand di sini
jadi setelah semua ini saya berakhir dengan file yang terlihat seperti ini:
function foo(bar, baz) {
console.log("something something");
return true;
}
perbarui 2016-06-07
Tampaknya pengelola uglify-js sekarang bekerja pada versi 2 meskipun pemasangannya sama.
uglifyjs -b
melakukan lebih dari sekadar memperbaiki lekukan, ia mengatur ulang dan menulis ulang kode, mungkin untuk efisiensi. Bukan itu yang saya inginkan. Saya menggunakan versi yang lebih lama, di Ubuntu 14.04.
uglifyjs -b
mengatur ulang dan menulis ulang kode?
$ sudo apt install jsbeautifier
$ js-beautify ugly.js > beautiful.js
js-beautify -o file.js file.js
Di konsol, Anda dapat menggunakan Artistic Style (alias AStyle) dengan --mode=java
.
Ini berfungsi dengan baik dan gratis, open-source dan lintas platform (Linux, Mac OS X, Windows).
Gunakan cara JavaScript modern:
Gunakan Grunt dalam kombinasi dengan plugin jsbeautifier untuk Grunt
Anda dapat menginstal semuanya dengan mudah ke dalam lingkungan dev Anda menggunakan npm .
Yang Anda perlukan hanyalah menyiapkan Gruntfile.js dengan tugas yang sesuai, yang juga dapat melibatkan penggabungan file, lint, uglify, minify dll, dan menjalankan perintah grunt.
Saya tidak dapat menambahkan komentar ke jawaban yang diterima jadi itu sebabnya Anda melihat postingan yang seharusnya tidak ada.
Pada dasarnya saya juga membutuhkan beautifier javascript dalam kode java dan yang mengejutkan saya tidak ada yang tersedia sejauh yang saya bisa temukan. Jadi saya mengkodekannya sendiri sepenuhnya berdasarkan jawaban yang diterima (ini membungkus skrip jsbeautifier.org beautifier .js tetapi dapat dipanggil dari java atau baris perintah).
Kode tersebut terletak di https://github.com/belgampaul/JsBeautifier
Saya menggunakan rhino dan beautifier.js
PENGGUNAAN dari konsol: indentasi skrip java -jar jsbeautifier.jar
contoh: java -jar jsbeautifier.jar "function ff () {return;}" 2
PENGGUNAAN dari kode java: public static String jsBeautify (String jsCode, int indentSize)
Anda dipersilakan untuk memperpanjang kode. Dalam kasus saya, saya hanya membutuhkan lekukan sehingga saya dapat memeriksa javascript yang dihasilkan saat mengembangkan.
Dengan harapan ini akan menghemat waktu Anda dalam proyek Anda.
Saya telah menulis artikel yang menjelaskan cara membuat beautifier JavaScript baris perintah yang diimplementasikan dalam JavaScript dalam waktu kurang dari 5 menit. YMMV.
- Unduh Rhino stable terbaru dan ekstrak di suatu tempat, misalnya ~ / dev / javascript / rhino
- Unduh beautify.js yang direferensikan dari jsbeautifier.org tersebut lalu salin di suatu tempat, misal ~ / dev / javascript / bin / cli-beautifier.js
Tambahkan ini di akhir beautify.js (menggunakan beberapa properti tingkat atas tambahan ke JavaScript):
// Run the beautifier on the file passed as the first argument. print( j23s_beautify( readFile( arguments[0] )));
Salin-tempel kode berikut dalam file yang dapat dijalankan, misalnya ~ / 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 $*
(opsional) Tambahkan folder dengan jsbeautifier.js ke PATH atau pindah ke beberapa folder yang sudah ada.
Saya yakin ketika Anda bertanya tentang alat baris perintah, Anda hanya ingin mempercantik semua file js Anda secara batch.
Dalam hal ini Intellij IDEA (diuji dengan 11.5) dapat melakukannya.
Anda hanya perlu memilih salah satu file proyek Anda dan memilih "Code" -> "Reformat code .." di menu IDE utama. Kemudian di dialog pilih "semua file di direktori ..." dan tekan "enter". Pastikan Anda mendedikasikan cukup memori untuk JVM.
Anda memiliki beberapa pilihan satu liner. Gunakan dengan npm atau standalone dengan npx .
npx semistandard "js/**/*.js" --fix
npx standard "js/**/*.js" --fix
npx prettier --single-quote --write --trailing-comma all "js/**/*.js"