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

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

quý khách hàng đã xem: Angular cli là gì

Thựctế họ bắt buộc một phương pháp nhằm cải cách và phát triển áp dụng Angular ở tại mức cao cùng với :

+Để cách tân và phát triển ứng dụng Angular thì bọn họ nên thiết lập Node.js, Node.js là1 căn cơ phía server mã nguồn msinh sống với miễn mức giá, được cho phép dịch và chạy các WebServer thực hiện JavaScript. Nó được sử dụng rộng dãi nhằm dịch áp dụng Web.Node.js gắn sát cùng với npm, npm (packagemanager) được sử dụng để quản lý những gói thông tincủa Node.js. Các bạn cũng có thể vào tác động www.npmjs.com, Tạitrên đây bao gồm chứa hàng vạn những gói ban bố miễn giá tiền, thiết kế viên đã downloadthông qua câu lệnh (Comm& Line) về để sử dụng.

+Ứng dụng được trở nên tân tiến vì chưng Angular, nhật định phải setup các gói thư viện cầnthiết mang đến bài toán cải cách và phát triển và biên dịch ứng dụng. những đoạn mã sẽ được viết bằngngôn ngữ TypeScript, trong quá trình thi công ứng dụng đang nên triển khai UnitTest, biên dịch để xúc tiến vận dụng.

Đểgiảm thiểu các phiền hậu hà đề cập bên trên, đội phát triển của Angular đang tạo thành Angular Cli. Angular Cli là cỗ công cụcung ứng cho phép tạo nên áp dụng, chế tạo những thành phần của Angular như component,module,… triển khai biên dịch áp dụng một biện pháp dễ ợt rộng.


*

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

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

Để tiến hành, đầutiên chúng ta đề xuất dòng đặt Node.js. Các chúng ta có thể vào địa chỉ url : https://nodejs.org/en/ để thực hiện downloadNode Js về máy tính và thiết lập.


*

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

Angular Cli đượccài đặt trải qua cửa sổ lệnh commvà.

Cú pháp mua đặtnhư sau :

npminstall -g angular/cli

sau thời điểm thiết lập đặtthành công xuất sắc những chúng ta có thể kiểm soát phiên phiên bản bây giờ bên trên laptop thông quacâu lệnh :

ng-v


*

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

3.Tạo Project bằng Angular Cli

Để tạo Project, đầutiên các bạn đề xuất bật cửa sổ tiến hành dòng lệnh, tiếp đến điều nhắm đến thư mụcao ước sản xuất Project. Tiếp theo các bạn thực hiện cú pháp tiếp sau đây nhằm chế tạo ra ProjectAngular 5 cùng với Angular Cli nhỏng sau :

ngnew PROJECT-NAME

PROJECT-NAME : Têndự án ý muốn tạo

lấy ví dụ như chế tạo Projectcùng với thương hiệu là SampleApp trong tlỗi mục E: ekkenbasara.mobiAngular 5Vidu.


*

Hình số 4: TạoProject

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

+ Tạo tên thư mụcnơi bắt đầu cất dự án công trình gồm thuộc thương hiệu cùng với tên dự án (Tại đó là thỏng mục “SampleApp”.

+ Bổ sung các filevới các thỏng mục quan trọng đến vận dụng.

+ Bổ sung những góithư viện nhỏ tuổi tốt nhất của Angular, buổi tối tgọi cần thiết cho quy trình dịch với triểnknhị áp dụng.

Xem thêm: Beneficiary Name Là Gì - What Is Definition Of Beneficiary

Sau Khi khởi tạongừng trường hợp thành công xuất sắc, tác dụng sẽ hiển thị như sau :


*

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

Sử dụng VisualSource Code nhằm mnghỉ ngơi thỏng mục bao gồm đựng dự án


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

Mô tả những cấu trúcvào ứng dụng :

e2e: Viết tắt của chữ end-to-over, đượcáp dụng nhằm bổ sung cập nhật những test, các kiểm tra này sẽ tiến hành triển khai nhằm kiểm định lạiquy trình triển khai các nghiệp vụ của font-end trên các trình chuẩn y khác biệt.

src:Thư mục cất toàn bộ mã code của ứng dụng.

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

.editorconfig: File cất công bố về biên tập

karma.conf.js: tệp tin này được áp dụng là nguồn vào cho quá trình chạy karma demo. Toàn cỗ những nộidung liên quan của tệp tin này được thực hiện để cấu hình đến Karma chạy thử.

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

protractor.conf.js: File cấu hình đựng các lên tiếng cấu hình nhằm chạy end-to-end kiểm tra lúc sử dụngprotractor.

tsconfig.json : Fileban bố cấu hình được thực hiện khi thực hiện biên dịch Typescript.

Xem thêm: " So What Là Gì ? So What Và So That

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

+ Chạy chương trình : Các các bạn thực hiện câulệnh : ng server

+Dịch công tác : Các bạn thực hiện câu lệnh : ng build

+Test chương thơm trình: Các chúng ta sử dụng câu lệnh : ng test

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

Các câu lệnh này đềuđược mô tả trong tệp tin package.json

Các câu lệnh thườngcần sử dụng khác:

+ Tạo Component : Các bạn sử dụng câulệnh : ng g component my-new-component

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

+Tạo Module : Các các bạn thực hiện câu lệnh : ng g module my-module

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

+TạoInterface: Các các bạn thực hiện câu lệnh : ng g class my-new-class

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

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

Để biết thêm chihuyết các chúng ta cũng có thể vào trang angular.io hoặc https://github.com/angular/angular-cliđể nghiên cứu sâu hơn về Angular Cli.


Chuyên mục: KHÁI NIỆM LÀ GÌ
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 *