Tập lệnh tạo bản dựng chặn

Blockly được tạo thành từ hơn một trăm tệp TypeScript. Các lớp này phải được trình biên dịch TypeScript, tsc, biên dịch thành JavaScript thì mới có thể sử dụng được. Thao tác này sẽ tạo ra một số lượng lớn tệp .js phù hợp để kiểm thử cục bộ, nhưng tải một số lượng lớn tệp như vậy qua Internet là trải nghiệm chậm đối với người dùng cuối. Để giúp Blockly tải nhanh hơn, Trình biên dịch đóng gói được dùng để nén (giảm thiểu) và kết hợp chúng thành nửa chục tệp ("gói" hoặc "chunks") với tổng kích thước nhỏ hơn một nửa so với các tệp không nén.

Trong quá trình này, mã sử dụng các tính năng ECMAScript mới nhất – những tính năng có thể không được tương thích với mọi trình duyệt—được chuyển đổi sang ES6, Thường thì tương thích với hầu hết các trình duyệt được sử dụng rộng rãi. Do đó, điều quan trọng là bạn chỉ phân phát mã rút gọn cho người dùng cuối.

Kho lưu trữ google/blockly chứa mã nguồn. Trước đây, thư viện này cũng chứa các sản phẩm xây dựng, nhưng kể từ năm 2019, các gói rút gọn đã được xuất bản dưới dạng Gói TLD blockly và kể từ đó Năm 2022 cũng được đính kèm dưới dạng tệp .tgz vào mỗi bản phát hành trên GitHub, do đó, bạn không cần để xây dựng Blockly, trừ phi bạn tấn công chính Blockly, đặc biệt là vào tệp trong thư mục core, blocks, generators hoặc msg.

Quá trình tạo, kiểm thử và phát hành Blockly được tự động hoá bằng cách sử dụng tập lệnh npm để chạy các tác vụ Gulp. Trang này ghi lại các tập lệnh chính và chức năng của từng tập lệnh.

Chế độ nén và giải nén

Việc tải Blockly trực tiếp từ các tệp .js riêng lẻ do trình biên dịch TypeScript tạo ra được gọi là "chế độ không nén". Vì tránh được một số bước xây dựng chậm, nên việc này tạo điều kiện cho chu kỳ chỉnh sửa-biên dịch-chạy nhanh chóng; đồng thời tạo điều kiện gỡ lỗi vì mã JavaScript đang được thực thi gần như dễ đọc như các nguồn TypeScript ban đầu, không cần phải phụ thuộc vào bản đồ nguồn.

Việc tải Blockly từ các gói rút gọn được gọi là "chế độ nén". Đây là cách tốt nhất để kiểm thử các thay đổi đối với Blockly khi sử dụng nó làm phần phụ thuộc của một gói khác, vì gói này kiểm thử (phiên bản chưa phát hành của) blockly npm.

Lưu ý: Có một số vị trí trong kho lưu trữ khối nơi các cụm từ "chế độ chưa biên dịch" và "chế độ biên dịch" được dùng làm từ đồng nghĩa với "uncompress" chế độ" và "chế độ nén" . Cách sử dụng này hợp lý trong quá khứ vì Trình biên dịch đóng gói được dùng để nén (giảm thiểu) mã, nhưng giờ đây trình biên dịch TypeScript luôn cần thiết, ngay cả ở chế độ không nén, vì vậy thuật ngữ thay thế này có thể gây nhầm lẫn và không được khuyến khích.

Bắt đầu nhanh

  • Nếu bạn đã thực hiện các thay đổi cục bộ và muốn đảm bảo rằng chúng không làm hỏng bản dựng hay bất kỳ thử nghiệm nào, hãy chạy

    npm test

    để xây dựng Blockly và chạy bộ kiểm thử của nó.

  • Nếu bạn muốn kiểm thử các thay đổi cục bộ trong trình duyệt, hãy chạy

    npm start

    Thao tác này sẽ biên dịch Blockly và mở một trình duyệt web trỏ đến sân chơi Blockly chạy Blockly ở chế độ không nén.

    Mọi tệp trong core/, blocks/ và generators/ đã được sửa đổi đều biên dịch lại tự động; tải lại thẻ trình duyệt để xem các thay đổi.

  • Để tạo phiên bản Blockly được sửa đổi cục bộ và kiểm thử phiên bản đó ở định dạng nén dưới dạng phần phụ thuộc của một gói npm khác, chạy

    npm run package

    để tạo gói Blockly, sau đó

    cd dist && npm link

    để cho npm biết nơi tìm các tệp đã biên dịch, sau đó cd vào thư mục của dự án trước khi chạy

    npm link blockly

    để gói của bạn sử dụng phiên bản mới được biên dịch của Blockly trong vị trí của gói blockly đã xuất bản.

Tài liệu tham khảo chi tiết về tập lệnh

Phần này liệt kê scripts nguyên tắc trong tệp package.json của Blockly cùng với nội dung giải thích về chức năng của các scripts này.

Các tập lệnh này tạo tệp ở hai vị trí:

  • Các tệp trong thư mục con build/ là các tệp trung gian được dùng cho các ứng dụng cục bộ kiểm thử hoặc nhập vào các phần sau của quy trình tạo bản dựng.
  • Các tệp trong thư mục con dist/ tạo thành nội dung của gói npm đã phát hành.

Cả hai thư mục này đều không được theo dõi trong kho lưu trữ git blockly.

clean

npm run clean dọn dẹp mọi bản dựng trước đó bằng cách xoá build/ và dist/ thư mục. Hữu ích khi sửa chữa các lỗi bản dựng phức tạp, đặc biệt những lỗi xảy ra do đổi tên tệp nguồn.

messages

npm run messages cập nhật các tệp tin nhắn trong msg/json/ khi có bất kỳ thay đổi nào đã được tạo cho msg/messages.js và sẽ được chạy sau mỗi lần hoạt động tệp đó đã được sửa đổi.

langfiles

npm run langfiles tạo các tệp ngôn ngữ đã biên dịch trong build/msg/ từ các tệp thông báo trong msg/json.

tsc

npm run tsc chạy trình biên dịch TypeScript trên nội dung của thư mục core/, blocks/ và generators/, đồng thời xuất các tệp .js riêng lẻ sang build/src/.

minify

npm run minify chạy closure-make-deps và closure-calculate-chunks để xác định cách chia tệp .js đã biên dịch thành các phần (giảm thiểu gói), sau đó sẽ chạy closure-compiler để tạo các phân đoạn dưới dạng sau:

  • Nội dung của build/src/core/ trở thành dist/blockly_compressed.js.
  • Nội dung của build/src/blocks/ trở thành dist/blocs_compressed.js.
  • Nội dung của build/src/generators/javascript/ (cộng với build/src/generators/javascript.js) trở thành dist/javascript_compressed.js.
  • Tương tự như vậy cho dart, lua, php và python.

Các khối được tạo sẽ sử dụng một trình bao bọc để đảm bảo khả năng tương thích với lớp Universal Định nghĩa mô-đun để không phải xử lý thêm cần thiết trước khi được đưa vào gói.

build

npm run build chạy các tác vụ minify và langfiles. Thao tác này sẽ mọi thứ cần thiết để tải trò chơi Blockly ở định dạng được nén hoặc chế độ không nén.

package

npm run package chạy các tác vụ clean và build, sau đó:

  • Áp dụng một trình bao bọc UMD cho các tệp trong đó build/msg/, đặt các phiên bản đã gói trong dist/msg/.
  • Thêm các tệp hỗ trợ bổ sung khác nhau vào dist/, với trình bao bọc UMD trong đó có thể áp dụng.

publish

npm run publish được nhóm Blockly sử dụng để phát hành gói npm blockly. Quá trình này phụ thuộc vào cơ sở hạ tầng nội bộ của Google nên không hữu ích cho các nhà phát triển bên ngoài.

lint

npm run lint chạy ESLint, thực hiện phân tích tĩnh của mã nguồn Blockly để tìm ra sự cố.

test

npm test (hoặc npm run test) chạy tác vụ package, sau đó chạy nhiều chương trình kiểm thử tự động (bao gồm cả việc chạy ESLint). Quá trình này sẽ chạy và truyền bất kỳ mã nào được gửi dưới dạng yêu cầu lấy dữ liệu đối với kho lưu trữ khối.