Hôm nay chúng ta sẽ xem cách cài đặt và thiết lập dự án bootstrap 5. Có nhiều cách để bạn có thể cài đặt bootstrap 5 bằng cách sử dụng bootstrap 5 CDN để thử nghiệm thiết kế giao diện người dùng hoặc tạo danh mục đầu tư đơn giản mà bạn có thể sử dụng cdn. hoặc bạn có thể sử dụng npm để cài đặt bootstrap 5. để xem
1] Thiết lập Bootstrap 5 với CDN
Nếu bạn đang tạo loại dự án nhỏ như danh mục đầu tư. trang đích hoặc thử nghiệm các thành phần bootstrap 5, thì bạn có thể sử dụng bootstrap 5 CDN.
Bootstrap 5 with CDN
Hello world
2] Tải xuống tệp nguồn Bootstrap 5
Bạn cũng có thể bắt đầu tải xuống tệp bootstrap 5.
Tải xuống
Sau khi tải xuống tệp bootstrap 5, bạn cần giải nén tệp zip. Sau đó, bạn cần thiết lập chỉ mục. tệp html
mục lục. html
Setup Bootstrap 5 folder structure
Hello world
3] Bắt đầu Bootstrap 5 với bộ công cụ Starter
Cài đặt mẫu bootstrap 5 qua npm
npm i startbootstrap-bare
hoặc sao chép bộ khởi động bootstrap 5
git clone //github.com/StartBootstrap/startbootstrap-bare.git
hoặc bạn có thể tải bootstrap 5 starter
https. //github. com/StartBootstrap/startbootstrap-bare
tập lệnh npm
npm run build xây dựng dự án - điều này xây dựng nội dung, HTML, JS và CSS vào dist
npm chạy xây dựng. tài sản sao chép các tệp trong thư mục src/assets/ vào dist
npm chạy xây dựng. pug biên dịch Pug nằm trong thư mục src/pug/ thành dist
npm chạy xây dựng. script mang đến src/js/scripts. js vào dist
npm chạy xây dựng. scss biên dịch các tệp SCSS nằm trong thư mục src/scss/ thành dist
npm run clean xóa thư mục dist để chuẩn bị build lại project
bắt đầu chạy npm. gỡ lỗi chạy dự án ở chế độ gỡ lỗi
npm start hoặc npm run start chạy dự án, khởi chạy bản xem trước trực tiếp trong trình duyệt mặc định của bạn và theo dõi các thay đổi được thực hiện đối với các tệp trong src