Nhưbọn họ vẫn biết, Các áp dụng Web hiện đại được các lập trình sẵn viên vạc triểndựa trên những Framework trẻ trung và tràn đầy năng lượng như Angular. Các framework này chất nhận được những lậptrình viên sử dụng những thư viện tiến bộ cùng phức tạp của Javascript. Để thực hiệnđược điều đó thì những bên cải tiến và phát triển đề nghị một môi trường để tùy chỉnh thiết lập các thư việnquan trọng tương tự như là nhằm cải cách và phát triển những đoạn mã vận dụng, toàn cục các vấn đềnày làm cho đối kháng mang, nó phần đông được tùy chỉnh nhằm phía bên trong cùng một thư mục, thỏng mụcnày đã đựng cả Code phần font-kết thúc của vận dụng.

Bạn đang xem: Angular cli là gì

Quý Khách đã xem: Angular cli là gì

Thựctế chúng ta bắt buộc một hình thức nhằm trở nên tân tiến vận dụng Angular ở mức cao cùng với :

+Để cải cách và phát triển áp dụng Angular thì chúng ta cần thiết đặt Node.js, Node.js là1 nền tảng phía hệ thống mã mối cung cấp mngơi nghỉ với miễn tổn phí, chất nhận được dịch và chạy các WebServer thực hiện JavaScript. Nó được thực hiện rộng dãi để dịch vận dụng Web.Node.js gắn sát với npm, npm (packagemanager) được sử dụng nhằm cai quản những gói thông tincủa Node.js. Các chúng ta cũng có thể vào liên hệ www.npmjs.com, Tạiphía trên bao gồm cất hàng chục ngàn những gói đọc tin miễn tầm giá, lập trình sẵn viên vẫn downloadtrải qua câu lệnh (Comm& Line) về để sử dụng.

+Ứng dụng được cải tiến và phát triển vị Angular, nhật định đề xuất cài đặt những gói thỏng viện cầnthiết cho bài toán cải cách và phát triển và biên dịch áp dụng. những đoạn mã sẽ tiến hành viết bằngngôn từ TypeScript, trong quá trình xây cất áp dụng vẫn buộc phải tiến hành UnitTest, biên dịch nhằm tiến hành áp dụng.

Đểgiảm tđọc các phiền hậu hà đề cập bên trên, đội trở nên tân tiến của Angular sẽ tạo ra Angular Cli. Angular Cli là cỗ công cụcung ứng được cho phép sản xuất vận dụng, tạo thành những thành phần của Angular nlỗi component,module,… thực hiện biên dịch ứng dụng một phương pháp thuận tiện rộng.


*

Hình số 1: Hình ảnhAngular Cli

2.Cài đặt áp dụng Angular Cli

Để triển khai, đầutiên chúng ta buộc phải mẫu đặt Node.js. Các chúng ta có thể vào cửa hàng url : https://nodejs.org/en/ nhằm tiến hành downloadNode Js về máy vi tính cùng cài đặt.


*

Hình số 2 : Hình ảnhNode JS

Angular Cli đượcsetup trải qua hành lang cửa số lệnh command.

Cú pháp mua đặtnlỗi sau :

npminstall -g angular/cli

sau khi download đặtthành công xuất sắc các bạn có thể chất vấn phiên bạn dạng ngày nay bên trên máy tính thông quacâu lệnh :

ng-v


*

Hình số 3 : Phiênphiên bản Angular Cli

3.Tạo Project bằng Angular Cli

Để tạo nên Project, đầutiên các bạn bắt buộc nhảy cửa sổ xúc tiến chiếc lệnh, tiếp nối điều nhắm đến tlỗi mụcao ước chế tác Project. Tiếp theo chúng ta áp dụng cú pháp dưới đây để tạo ProjectAngular 5 cùng với Angular Cli nlỗi sau :

ngnew PROJECT-NAME

PROJECT-NAME : Têndự án công trình mong tạo

Ví dụ chế tác Projectcùng với tên là SampleApp vào tlỗi mục E:hjwitteveen.comAngular 5Vidu.


*

Hình số 4: TạoProject

Câu lệnh đã đượctriển khai vào một vài ba phút ít, cùng với các nhiệm vụ như sau :

+ Tạo tên thư mụccội chứa dự án công trình có thuộc thương hiệu cùng với tên dự án (Tại đó là thỏng mục “SampleApp”.

+ Bổ sung những filevà những thư mục quan trọng mang lại áp dụng.

+ Bổ sung các góithỏng viện nhỏ dại tuyệt nhất của Angular, về tối thiểu cần thiết cho quá trình dịch với triểnknhì vận dụng.

Xem thêm: " Niêm Yết Tiếng Anh Là Gì ? Niêm Yết Trong Tiếng Tiếng Anh

Sau Khi khởi tạokết thúc trường hợp thành công xuất sắc, công dụng vẫn hiển thị như sau :


*

Hình số 5 : TạoProject thành công

Sử dụng VisualSource Code nhằm msống tlỗi mục tất cả cất dự án


Hình số 6: Cấutrúc áp dụng Angular

Mô tả các cấu trúctrong áp dụng :

e2e: Viết tắt của chữ end-to-kết thúc, đượcáp dụng nhằm bổ sung những demo, các kiểm tra này sẽ được triển khai nhằm mục tiêu kiểm định lạiquá trình triển khai các nghiệp vụ của font-end bên trên các trình coi xét khác nhau.

src:Tlỗi mục chứa toàn bộ mã code của vận dụng.

.angular-cli.json:tệp tin cất lên tiếng cấu hình được áp dụng bởi vì Angular Cli, văn bản của file đượcđặt tả theo .json. Nó cất báo cáo của thương hiệu tệp tin .html được chạy thứ nhất của ứngdụng, các tệp tin typescrip được hấp thụ trong quá trình chạy vận dụng, các thông số kỹ thuật đểtrỏ đến đường truyền những tệp tin typescript trong Source Code với vào Test.

.editorconfig: File chứa báo cáo về chỉnh sửa

karma.conf.js: tệp tin này được sử dụng là đầu vào cho quá trình chạy karma test. Toàn cỗ các nộidung tương quan của tệp tin này được thực hiện để thông số kỹ thuật mang đến Karma demo.

package.json: Liệt kê list những thư viện được thực hiện trong ứng dụng tương tự như thiết lậpcác câu lệnh nhằm thực hiện bài toán chạy, dịch, demo áp dụng.

protractor.conf.js: File thông số kỹ thuật cất các thông báo cấu hình nhằm chạy end-to-over chạy thử Khi sử dụngprotractor.

tsconfig.json : Filethông tin thông số kỹ thuật được sử dụng lúc tiến hành biên dịch Typescript.

4.Một số những câu lệnh cơ bản của Angilar Cli

+ Chạy công tác : Các bạn sử dụng câulệnh : ng server

+Dịch lịch trình : Các các bạn sử dụng câu lệnh : ng build

+Test cmùi hương trình: Các các bạn áp dụng câu lệnh : ng test

+ Kiểm tra cú pháp TypeScrip : Các bạn áp dụng câulệnh : ng lint

Các câu lệnh này đềuđược biểu hiện vào file package.json

Các câu lệnh thườngdùng khác:

+ Tạo Component : Các các bạn thực hiện câulệnh : ng g component my-new-component

+Tạo Service : Các chúng ta áp dụng câu lệnh : ng g service my-new-service

+Tạo Module : Các chúng ta áp dụng câu lệnh : ng g module my-module

+TạoClass: Các chúng ta thực hiện câu lệnh : ng g class my-new-class

+TạoInterface: Các các bạn sử dụng câu lệnh : ng g class my-new-class

+TạoEnum: Các các bạn sử dụng câu lệnh : ng g enum my-new-enum

+TạoPipe: Các chúng ta áp dụng câu lệnh : ng g pipe my-new-pipe

Để hiểu thêm chitiết các bạn có thể vào trang angular.io hoặc https://github.com/angular/angular-clinhằm nghiên cứu sâu hơn về Angular Cli.

Bài viết liên quan

Trả lời

Email của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *