Source

Xây dựng công cụ

Tìm hiểu cách sử dụng các tập lệnh npm có trong Bootstrap để xây dựng tài liệu của chúng tôi, biên dịch mã nguồn, chạy thử nghiệm và hơn thế nữa.

Thiết lập dụng cụ

Bootstrap sử dụng các tập lệnh NPM cho hệ thống xây dựng của nó. Package.json của chúng tôi bao gồm các phương pháp thuận tiện để làm việc với khuôn khổ, bao gồm biên dịch mã, chạy thử nghiệm và hơn thế nữa.

Để sử dụng hệ thống xây dựng của chúng tôi và chạy tài liệu của chúng tôi cục bộ, bạn sẽ cần một bản sao của các tệp nguồn và Node của Bootstrap. Hãy làm theo các bước sau và bạn sẽ sẵn sàng:

  1. Tải xuống và cài đặt Node.js , mà chúng tôi sử dụng để quản lý các phần phụ thuộc của mình.
  2. Điều hướng đến thư mục gốc /bootstrapvà chạy npm installđể cài đặt các phụ thuộc cục bộ của chúng tôi được liệt kê trong package.json .
  3. Cài đặt Ruby , cài đặt Bundler với gem install bundlervà cuối cùng là chạy bundle install. Điều này sẽ cài đặt tất cả các phụ thuộc của Ruby, chẳng hạn như Jekyll và các plugin.
    • Người dùng Windows: Đọc hướng dẫn này để bắt đầu và chạy Jekyll mà không gặp sự cố.

Khi hoàn thành, bạn sẽ có thể chạy các lệnh khác nhau được cung cấp từ dòng lệnh.

Sử dụng tập lệnh NPM

Package.json của chúng tôi bao gồm các lệnh và tác vụ sau:

Nhiệm vụ Sự mô tả
npm run dist npm run disttạo thư mục /distvới các tệp đã biên dịch. Sử dụng Sass , Autoprefixer và UglifyJS .
npm test Giống như npm run distcộng với nó chạy thử nghiệm cục bộ
npm run docs Xây dựng và bổ sung CSS và JavaScript cho tài liệu. Sau đó, bạn có thể chạy tài liệu cục bộ qua npm run docs-serve.

Chạy npm runđể xem tất cả các tập lệnh npm.

Trình sửa lỗi tự động

Bootstrap sử dụng Autoprefixer (có trong quy trình xây dựng của chúng tôi) để tự động thêm tiền tố của nhà cung cấp vào một số thuộc tính CSS tại thời điểm xây dựng. Làm như vậy giúp chúng tôi tiết kiệm thời gian và mã bằng cách cho phép chúng tôi viết các phần chính của CSS của chúng tôi một lần duy nhất trong khi loại bỏ nhu cầu về các mixin của nhà cung cấp như những gì được tìm thấy trong v3.

Chúng tôi duy trì danh sách các trình duyệt được hỗ trợ thông qua Autoprefixer trong một tệp riêng trong kho lưu trữ GitHub của chúng tôi. Xem /.b browserlistrc để biết thêm chi tiết.

Tài liệu địa phương

Việc chạy cục bộ tài liệu của chúng tôi yêu cầu sử dụng Jekyll, một trình tạo trang web tĩnh rất linh hoạt cung cấp cho chúng tôi: bao gồm cơ bản, tệp dựa trên Markdown, mẫu và hơn thế nữa. Đây là cách bắt đầu:

  1. Chạy qua thiết lập công cụ ở trên để cài đặt Jekyll (trình tạo trang web) và các phụ thuộc Ruby khác với bundle install.
  2. Từ thư mục gốc /bootstrap, chạy npm run docs-servetrong dòng lệnh.
  3. Mở http://localhost:9001trong trình duyệt của bạn và voilà.

Tìm hiểu thêm về cách sử dụng Jekyll bằng cách đọc tài liệu của nó .

Xử lý sự cố

Nếu bạn gặp sự cố khi cài đặt phần phụ thuộc, hãy gỡ cài đặt tất cả các phiên bản phụ thuộc trước đó (toàn cầu và cục bộ). Sau đó, chạy lại npm install.