Tôi đang viết một tập lệnh hàng loạt để làm đẹp mã JavaScript. Nó cần hoạt động trên cả Windows và Linux .
Làm cách nào để làm đẹp mã JavaScript bằng các công cụ dòng lệnh?
Tôi đang viết một tập lệnh hàng loạt để làm đẹp mã JavaScript. Nó cần hoạt động trên cả Windows và Linux .
Làm cách nào để làm đẹp mã JavaScript bằng các công cụ dòng lệnh?
Câu trả lời:
Đầu tiên, chọn Pretty Print / Beautifier dựa trên Javascript yêu thích của bạn. Tôi thích cái ởhttp://jsbeautifier.org/ , vì đó là thứ tôi tìm thấy đầu tiên. Tải xuống tệp của nó https://github.com/beautify-web/js-beautify/blob/master/js/lib/beautify.js
Thứ hai, tải xuống và cài đặt công cụ Javascript dựa trên Java của Mozilla, Rhino . "Cài đặt" là một chút sai lầm; Tải xuống tệp zip, giải nén mọi thứ, đặt js.jar vào đường dẫn Java của bạn (hoặc Thư viện / Java / Phần mở rộng trên OS X). Sau đó, bạn có thể chạy các tập lệnh với một lời gọi tương tự như thế này
java -cp js.jar org.mozilla.javascript.tools.shell.Main name-of-script.js
Sử dụng Pretty Print / Beautifier từ bước 1 để viết một tập lệnh shell nhỏ sẽ đọc trong tệp javascript của bạn và chạy nó qua Pretty Print / Beautifier từ bước một. Ví dụ
//original code
(function() { ... js_beautify code ... }());
//new code
print(global.js_beautify(readFile(arguments[0])));
Rhino cung cấp cho javascript một vài chức năng hữu ích bổ sung không nhất thiết phải có ý nghĩa trong ngữ cảnh trình duyệt, nhưng có thể thực hiện trong ngữ cảnh bảng điều khiển. Hàm print thực hiện những gì bạn mong đợi và in ra một chuỗi. Hàm readFile chấp nhận một chuỗi đường dẫn tệp làm đối số và trả về nội dung của tệp đó.
Bạn sẽ gọi ở trên một cái gì đó như
java -cp js.jar org.mozilla.javascript.tools.shell.Main beautify.js file-to-pp.js
Bạn có thể kết hợp và kết hợp Java và Javascript trong các tập lệnh chạy Rhino của mình, vì vậy nếu bạn biết một chút Java thì cũng không quá khó để chạy nó với các luồng văn bản.
CẬP NHẬT tháng 4 năm 2014 :
Trình làm đẹp đã được viết lại kể từ khi tôi trả lời câu hỏi này vào năm 2010. Hiện tại có một mô-đun python trong đó, Gói npm cho nodejs và tệp jar đã biến mất. Vui lòng đọc trang dự án trên github.com .
Kiểu Python:
$ pip install jsbeautifier
Phong cách NPM:
$ npm -g install js-beautify
để dùng nó:
$ js-beautify file.js
Câu trả lời ban đầu
Thêm vào câu trả lời của @Alan Storm
trình làm đẹp dòng lệnh dựa trên http://jsbeautifier.org/ đã trở nên dễ sử dụng hơn một chút, bởi vì nó hiện (cách khác) dựa trên công cụ javascript V8 (mã c ++) thay vì tê giác (công cụ JS dựa trên java, được đóng gói là "js.jar"). Vì vậy, bạn có thể sử dụng V8 thay vì tê giác.
Cách sử dụng:
tải xuống tệp zip jsbeautifier.org từ http://github.com/einars/js-beautify/zipball/master
(đây là URL tải xuống được liên kết với tệp zip như http://download.github.com/einars-js-beautify-10384df.zip )
cũ (không còn hoạt động, tệp jar đã biến mất)
java -jar js.jar name-of-script.js
mới (thay thế)
cài đặt / biên dịch v8 lib TỪ svn, xem v8 / README.txt trong tệp zip nói trên
./jsbeautify somefile.js
-có các tùy chọn dòng lệnh hơi khác so với phiên bản tê giác,
-và hoạt động tốt trong Eclipse khi được định cấu hình như một "Công cụ bên ngoài"
Nếu bạn đang sử dụng nodejs thì hãy thử uglify-js
Trên Linux hoặc Mac, giả sử bạn đã cài đặt nodejs, bạn có thể cài đặt uglify với:
sudo npm install -g uglify-js
Và sau đó nhận các tùy chọn:
uglifyjs -h
Vì vậy, nếu tôi có một tệp nguồn foo.js
trông giống như sau:
// foo.js -- minified
function foo(bar,baz){console.log("something something");return true;}
Tôi có thể làm đẹp nó như vậy:
uglifyjs foo.js --beautify --output cutefoo.js
uglify
sử dụng dấu cách để thụt lề theo mặc định, vì vậy nếu tôi muốn chuyển đổi thụt lề 4 dấu cách thành các tab, tôi có thể chạy nó qua unexpand
Ubuntu 12.04 đi kèm:
unexpand --tabs=4 cutefoo.js > cuterfoo.js
Hoặc bạn có thể làm tất cả trong một lần:
uglifyjs foo.js --beautify | unexpand --tabs=4 > cutestfoo.js
Bạn có thể tìm hiểu thêm về unxpand tại đây
vì vậy sau tất cả những điều này, tôi kết thúc với một tệp trông giống như vậy:
function foo(bar, baz) {
console.log("something something");
return true;
}
cập nhật 2016-06-07
Có vẻ như người bảo trì uglify-js hiện đang làm việc trên phiên bản 2 mặc dù cài đặt vẫn như cũ.
uglifyjs -b
không chỉ sửa lỗi thụt lề, nó sắp xếp lại và viết lại mã, có lẽ để hiệu quả. Đó không phải là điều tôi muốn. Tôi đang sử dụng phiên bản cũ hơn, trong Ubuntu 14.04.
uglifyjs -b
sắp xếp lại và viết lại mã không?
$ sudo apt install jsbeautifier
$ js-beautify ugly.js > beautiful.js
js-beautify -o file.js file.js
Trong bảng điều khiển, bạn có thể sử dụng Phong cách nghệ thuật (hay còn gọi là AStyle) với --mode=java
.
Nó hoạt động tuyệt vời và miễn phí, mã nguồn mở và đa nền tảng (Linux, Mac OS X, Windows).
Sử dụng cách JavaScript hiện đại:
Sử dụng Grunt kết hợp với plugin jsbeautifier cho Grunt
Bạn có thể dễ dàng cài đặt mọi thứ vào môi trường nhà phát triển của mình bằng npm .
Tất cả những gì bạn cần là thiết lập một Gruntfile.js với các tác vụ thích hợp, cũng có thể liên quan đến việc nối tệp, lint, uglify, minify, v.v. và chạy lệnh grunt.
Tôi không thể thêm nhận xét vào câu trả lời được chấp nhận, vì vậy đó là lý do tại sao bạn thấy một bài đăng đáng lẽ không tồn tại ngay từ đầu.
Về cơ bản, tôi cũng cần một trình làm đẹp javascript trong mã java và tôi ngạc nhiên là không có cái nào khả dụng theo như tôi có thể tìm thấy. Vì vậy, tôi đã tự mình viết mã một câu hoàn toàn dựa trên câu trả lời được chấp nhận (nó bao bọc tập lệnh .js jsbeautifier.org beauty nhưng có thể gọi được từ java hoặc dòng lệnh).
Mã được đặt tại https://github.com/belgampaul/JsBeautifier
Tôi đã sử dụng tê giác và beauty.js
USAGE từ bảng điều khiển: java -jar jsbeautifier.jar script thụt lề
ví dụ: java -jar jsbeautifier.jar "function ff () {return;}" 2
SỬ DỤNG từ mã java: public static String jsBeautify (String jsCode, int indentSize)
Bạn có thể mở rộng mã. Trong trường hợp của tôi, tôi chỉ cần thụt lề để có thể kiểm tra javascript được tạo trong khi phát triển.
Với hy vọng nó sẽ giúp bạn tiết kiệm thời gian trong dự án của mình.
Tôi đã viết một bài báo giải thích cách xây dựng trình làm đẹp JavaScript dòng lệnh được triển khai trong JavaScript trong vòng chưa đầy 5 phút. YMMV.
- Tải xuống Rhino ổn định mới nhất và giải nén nó ở đâu đó, ví dụ: ~ / dev / javascript /hino
- Tải xuống beauty.js được tham chiếu từ jsbeautifier.org đã nói ở trên, sau đó sao chép nó ở đâu đó, ví dụ ~ / dev / javascript / bin / cli-beauty.js
Thêm cái này vào cuối beauty.js (sử dụng một số thuộc tính cấp cao nhất bổ sung cho JavaScript):
// Run the beautifier on the file passed as the first argument. print( j23s_beautify( readFile( arguments[0] )));
Sao chép-dán mã sau vào tệp thực thi, ví dụ: ~ / 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 $*
(tùy chọn) Thêm thư mục có jsbeautifier.js vào PATH hoặc di chuyển đến một số thư mục đã có ở đó.
Tôi tin rằng khi bạn hỏi về công cụ dòng lệnh, bạn chỉ muốn làm đẹp hàng loạt các tệp js của mình.
Trong trường hợp này, Intellij IDEA (được thử nghiệm với 11.5) có thể thực hiện điều này.
Bạn chỉ cần chọn bất kỳ tệp dự án nào của mình và chọn "Mã" -> "Định dạng lại mã .." trong menu IDE chính. Sau đó trong hộp thoại chọn "all files in directory ..." và nhấn "enter". Chỉ cần đảm bảo rằng bạn dành đủ bộ nhớ cho JVM.
Bạn có một vài lựa chọn một lớp lót. Sử dụng với npm hoặc độc lập với npx .
npx semistandard "js/**/*.js" --fix
npx standard "js/**/*.js" --fix
npx prettier --single-quote --write --trailing-comma all "js/**/*.js"