Angular là một khung ứng dụng web nguồn mở sử dụng JavaScript. Không giống như một số framework hoặc ngôn ngữ lập trình khác, bạn cần thiết lập biến môi trường trong Windows để framework này hoạt động. Vì vậy, chúng ta phải học cách thiết lập Angular trong Mã VS và viết mã demo, đó là những gì chúng tôi sẽ làm.
Cách thiết lập Angular trong Mã VS
Để thiết lập Angular trong VS Code trên máy tính Windows của bạn, bạn cần làm theo các bước được đề cập bên dưới.
- Cài đặt mã Visual Studio
- Thiết lập NodeJS
- Thiết lập biến môi trường
- Cài đặt góc
Hãy để chúng tôi nói về họ một cách chi tiết.
1) Cài đặt mã Visual Studio
Để bắt đầu hành trình viết mã trong lĩnh vực Angular, chúng ta cần cài đặt Visual Studio Code. Để làm điều tương tự, bạn cần truy cập code.visualstudio.com và tải xuống ứng dụng cho môi trường của bạn. Sau khi tải về, hãy truy cập vào Tải xuống thư mục, chạy phương tiện cài đặt và cài đặt ứng dụng.
2) Thiết lập NodeJS
Điều quan trọng cần lưu ý là mặc dù bạn có thể sử dụng VSCode để chỉnh sửa Angular nhưng bạn không thể chạy nó trực tiếp trong trình chỉnh sửa. Angular thực sự được thực thi trong NodeJS, đây là môi trường JavaScript là một phần của quá trình thiết lập phát triển web cục bộ của bạn. Với NodeJS, bạn có thể chạy Angular trên máy chủ cục bộ của mình trong trình duyệt web. Mỗi khi bạn thực hiện thay đổi đối với mã Angular trong VSCode, nó sẽ tự động tải lại trong trình duyệt, được gọi là “tải lại nóng”. Tuy nhiên, vì Angular chạy trong NodeJS nên trước tiên bạn cần cài đặt NodeJS. Bạn có thể thực hiện việc này bằng cách truy cập nodejs.org.
Khi cài đặt Node JS để chạy Angular, hãy chọn một vị trí dễ nhớ, chẳng hạn như một đường dẫn đơn giản và ngắn gọn. Điều này sẽ hữu ích nếu sau này bạn cần sử dụng NodeJS. Vì vậy, thay vì cài đặt ứng dụng trong Tệp chương trình, hãy cài đặt ứng dụng đó trong D:\NodeJS, mặc dù điều đó không thành vấn đề.
3) Thiết lập biến môi trường
Tiếp theo, chúng ta cần thiết lập biến môi trường cho NodeJ trước khi tiếp tục và cài đặt Angular. Để làm tương tự, hãy làm theo các bước sau.
- Nhấn Win + S, gõ “Biến đổi môi trường” rồi mở nó ra.
- Sau khi hoàn tất, bạn cần sao chép vị trí của NodeJS. Chỉ để tham khảo, của chúng tôi là D:\NodeJS.
- Bấm vào Biến môi trường.
- Bây giờ, chọn Đường dẫn trong phần Biến hệ thống và nhấp vào Chỉnh sửa.
- Nhấp vào Mới, dán vị trí và nhấp vào Ok.
Bằng cách này, bạn đã nhập biến Môi trường NodeJS. Để kiểm tra xem nó có hoạt động không, hãy mở Dấu nhắc lệnh rồi chạy nút –version. Nếu nó cung cấp cho bạn một phiên bản, chúng tôi khuyên bạn nên cài đặt Angular.
4) Cài đặt góc
Sau khi tạo môi trường thích hợp bằng cách cài đặt NodeJS, chúng ta sẽ cài đặt Angular. Thực hiện theo các bước được đề cập dưới đây để làm tương tự.
- Mở Mã Visual Studio.
- Điều hướng đến vị trí bạn muốn tạo tệp Angular bằng lệnh CD hoặc Change Directory. Chúng tôi đã tạo một thư mục mới trong ổ D để tạo dự án, hãy xem ảnh chụp màn hình đính kèm.
Hy vọng rằng bây giờ bạn có thể chạy Angular mà không gặp vấn đề gì.
Đọc: Làm cách nào để cài đặt JavaScript trong VSCode?
Lệnh này không khả dụng khi chạy Angular CLI bên ngoài không gian làm việc
Khi tôi chạy lệnh “ng phục vụ”, tôi gặp lỗi cho biết lệnh này không khả dụng. Nhiều người nghi ngờ rằng Angular không được cài đặt trên hệ thống của họ, trong khi trên thực tế, vấn đề duy nhất là bạn không ở đúng thư mục. Để giải quyết nó, chỉ cần thực hiện ‘cd’ vào thư mục chứa dự án, không phải vị trí gốc mà là vị trí dự án thực tế. Vì vậy, lúc đầu, khi tôi chạy lệnh, tôi đang ở trong AngularProject, thư mục gốc của tôi nên nó không hoạt động. Tuy nhiên, nó hoạt động trơn tru khi tôi thay đổi thư mục thành sampleFolder và chạy lệnh tương tự.
Một cách giải quyết mà chúng tôi khuyên bạn nên làm là mở File Explorer, đi tới vị trí lưu trữ dự án của bạn, nhấp chuột phải vào màn hình trống và chọn Thiết bị đầu cuối> Dấu nhắc lệnh. Và sau đó chạy ng phục vụ.
Đọc: Làm cách nào để tải xuống và cài đặt Java JDK trên Windows?
Làm cách nào để thiết lập dự án Angular trong Visual Studio Code?
Để thiết lập dự án Angular, trước tiên bạn cần cài đặt NodeJS trên máy tính của mình. Sau khi hoàn tất, bạn cần định cấu hình Biến môi trường và cài đặt Angular bằng cách sử dụng cài đặt npm -g @angular/cli yêu cầu. Bây giờ, hãy tiếp tục và tạo một thư mục mới bằng cách sử dụng ng tên thư mục mới lệnh, để biết thêm, hãy xem các bước được đề cập trước đó.
Đọc: Cách định cấu hình Mã VS cho Microsoft C++
Làm cách nào để tạo VSCode góc?
Angular File Generator là một tiện ích mở rộng tiện dụng dành cho Visual Studio Code, cho phép bạn tạo các tệp Angular chỉ bằng vài cú nhấp chuột. Nó được xây dựng trên Angular CLI và sử dụng sơ đồ tương tự như CLI. Ngoài ra, nó còn cung cấp tùy chọn tạo tệp ngay từ thiết bị đầu cuối.
Cũng đọc: Cách cài đặt Python trong Mã VS.
