Cách tạo dự án JavaScript trong Eclipse

Hoàn thành các bước sau trong Eclipse để nhận phần bổ trợ cho tệp JavaScript

1. Mở Eclipse -> Chuyển đến "Trợ giúp" -> "Cài đặt phần mềm mới"
2. Chọn kho lưu trữ cho phiên bản Eclipse của bạn. Tôi có Juno nên tôi đã chọn http://download.eclipse.org/releases/juno
3. Mở rộng "Ngôn ngữ lập trình" -> Chọn hộp bên cạnh "Công cụ phát triển JavaScript"
4. Nhấp vào "Tiếp theo" -> "Tiếp theo" -> Chấp nhận Điều khoản của Thỏa thuận cấp phép -> "Hoàn tất"
5. Đợi phần mềm cài đặt, sau đó khởi động lại Eclipse (bằng cách nhấp vào nút "Có" ở cửa sổ bật lên)
6. Khi Eclipse đã khởi động lại, hãy mở "Cửa sổ" -> "Tùy chọn" -> Mở rộng "Chung" và "Trình chỉnh sửa" -> Nhấp vào "Liên kết tệp" -> Thêm ". js" vào "Các loại tệp. " danh sách, nếu nó chưa có
7. Trong cùng hộp thoại "Liên kết tệp", nhấp vào "Thêm" trong "Trình chỉnh sửa được liên kết. " phần
8. Chọn radio "Trình chỉnh sửa nội bộ" ở trên cùng
9. Chọn "Trình xem JavaScript". Nhấp vào "OK" -> "OK"

Để thêm Phối cảnh JavaScript. (Không bắt buộc)
10. Chuyển đến "Cửa sổ" -> "Phối cảnh mở" -> "Khác. "
11. Chọn "JavaScript". Nhấp vào "OK"

Mở. html hoặc. js với cú pháp JavaScript được đánh dấu
12. (Tùy chọn) Chọn Phối cảnh JavaScript
13. Duyệt và chọn. html hoặc. js trong Script Explorer ở [Phối cảnh JavaScript] (Hoặc Trình khám phá gói [Phối cảnh Java] Hoặc Trình khám phá gói PyDev [Phối cảnh PyDev] Không thành vấn đề. )
14. Nhấp chuột phải vào. html hoặc. js -> "Mở bằng" -> "Khác. "
15. Chọn "Trình chỉnh sửa nội bộ"
16. Chọn "Trình chỉnh sửa Javascript". Nhấp vào "OK" (xem cú pháp JavaScript hiện được đánh dấu)

Eclipse có thể được sử dụng như một IDE để lập trình Javascript. Điều này hữu ích nếu bạn muốn tự động hoàn thành và đánh dấu cú pháp khi bạn đang chỉnh sửa hoặc đọc mã Javascript

• Để làm việc với các dự án có HTML, CSS và Javascript, chúng ta cần cài đặt Eclipse Web Tools Platform (WTP). Cách dễ nhất để có được điều này là cài đặt một trong các gói Eclipse tất cả trong một có WTP trong đó. Ví dụ: bạn có thể tải xuống gói Eclipse Java EE vì gói này có WTP

• Mở Eclipse và tạo một Dự án mới. Chọn Web > Dự án Web tĩnh. Điều này cho phép bạn có các tệp HTML, CSS và Javascript

• Nhấp chuột phải vào tên dự án trong Project Explorer và tạo một tệp Javascript mới, chẳng hạn như index.js. Theo mặc định, điều này được tạo trong thư mục con WebContent. Tệp Javascript đơn giản này có chức năng cộng hai số và nó hiển thị kết quả trong hộp thoại bật lên

  Công cụ phát triển JavaScript (JSDT) cung cấp các trình cắm triển khai IDE hỗ trợ phát triển các ứng dụng JavaScript và JavaScript trong các ứng dụng web. Nó bổ sung một loại dự án JavaScript và phối cảnh vào Bàn làm việc của Eclipse cũng như một số dạng xem, trình chỉnh sửa, trình hướng dẫn và trình tạo

  Kiến trúc JSDT

  JSDT đã trải qua quá trình tái cấu trúc lớn trong Neon, không chỉ thay đổi nền tảng cốt lõi mà còn thêm các tính năng mới như Bower, npm, trình soạn thảo JSON, trình phân tích cú pháp ECMAScript 2015 (ES6), Node. js và Công cụ xây dựng JavaScript (Gulp / Grunt)

  Thành phần JSDT

  Công cụ phát triển JavaScript (JSDT) được chia thành ba khu vực, bao gồm

  1. JSDT Core - bao gồm trình phân tích cú pháp, trình biên dịch, DOM và hơn thế nữa
  2. Giao diện người dùng JSDT - bao gồm tất cả các bit giao diện người dùng để tạo IDE JavaScript (trình hướng dẫn, hộp thoại, tùy chọn, v.v.)
  3. Gỡ lỗi JSDT - bao gồm hỗ trợ gỡ lỗi JavaScript bằng Rhino và Crossfire
  4. JSDT Web - bất kỳ và tất cả hỗ trợ cho JavaScript phía Máy khách (trang web), được triển khai trong dự án Chỉnh sửa Nguồn của WTP

  Trang phát triển bao gồm các hướng dẫn để thiết lập môi trường của bạn và cách đóng góp tại đây

  Mới và đáng chú ý

  Thành phần gỡ lỗi JSDT rất nhạy bén với các ý tưởng mới, yêu cầu tính năng và báo cáo lỗi. Sau đây là danh sách một số bổ sung mới nhất và thú vị hơn cho thành phần

  Bạn có thể tìm thấy các tính năng mới nhất và tốt nhất trên trang WTP Mới và Đáng chú ý Mới và Đáng chú ý. Các mục nhập cho JSDT có thể được tìm thấy trong phần Chỉnh sửa nguồn và JSDT

  Eclipse là một IDE mã nguồn mở, miễn phí phổ biến khác giữa các nhà phát triển web và nhà phát triển sử dụng các ngôn ngữ lập trình khác

  Nó được xây dựng để phát triển Java nhưng giờ đây bao gồm nhiều công cụ để làm việc với các ngôn ngữ lập trình khác. HTML, CSS, JavaScript, Ruby, Python, PHP, v.v.

  Eclipse có thể xử lý toàn bộ dự án web và thậm chí có thể được tích hợp với bất kỳ công cụ phát triển phổ biến nào khác được yêu cầu để tạo các ứng dụng web thành một giao diện duy nhất

  Ngoài ra, nó cũng hỗ trợ nhiều plugin khác nhau và bất kỳ ai cũng có thể tạo plugin để mở rộng chức năng của Eclipse. Do có rất nhiều tính năng trong Eclipse, chúng ta cũng có thể sử dụng IDE này để phát triển web

  Để sử dụng IDE Eclipse cho dự án phát triển web, bạn cần tải xuống Eclipse và cài đặt nó. Vì vậy, hãy hiểu từng bước quá trình tải xuống và cài đặt

  Làm cách nào để tải xuống và cài đặt Eclipse IDE?

  ---

  Sau đây là các bước để tải xuống, cài đặt Eclipse và thiết lập môi trường phát triển cho JavaScript. Chúng như sau

  Bước 1 . Tải xuống nhật thực từ liên kết đã cho. https. // nhật thực. tổ chức/tải xuống

  Chọn phiên bản ổn định mới nhất của Eclipse IDE và đảm bảo rằng nếu hệ thống máy tính của bạn là 64-bit, hãy chọn Eclipse 64-bit

  Bước 2 . Sau khi tải xuống hoàn tất, nhấp vào hình elip. exe để mở nhật thực sẽ yêu cầu chọn một thư mục cục bộ làm không gian làm việc của nó. Không gian làm việc là thư mục hoặc nơi nhật thực sẽ lưu trữ các dự án của bạn.

  Bước 3 . Tạo hoặc chọn một thư mục cục bộ trên ổ C nơi bạn muốn lưu trữ dự án JavaScript của mình và nhấp vào nút OK để bắt đầu nhật thực.

  Bạn cũng có thể tạo một thư mục có tên phù hợp cho dự án JavaScript của mình trên ổ C và duyệt thư mục đó từ trình khởi chạy không gian làm việc

  ---

  Bước 4 . Khi nhật thực mở ra, hãy điều hướng dưới dạng Tệp -> Mới -> Dự án web tĩnh. Nhấp vào liên kết như hiển thị bên dưới trong ảnh chụp màn hình.

  Bước 5 . Nó sẽ mở ra một hộp thoại cửa sổ yêu cầu bạn nhập tên của dự án. Nhập tên dự án “Dự án JavaScript” và nhấp vào nút ‘Hoàn tất’ như trong ảnh chụp màn hình bên dưới.
  

  
  

  Bước 6 . Mở rộng thư mục dự án JavaScript ở phía bên trái của Eclipse (trình khám phá dự án) và nhấp chuột phải vào thư mục 'WebContent'.

  Để tạo tệp HTML trong dự án JavaScript hiện tại, hãy điều hướng đến Mới -> Tệp HTML như được hiển thị bên dưới trong ảnh chụp màn hình

  Bước 7 . Nó sẽ mở ra một hộp thoại cửa sổ yêu cầu bạn viết tên tệp. Vui lòng nhập tên tệp “myJavascriptProgram” và nhấp vào nút ‘Finish’ như hình bên dưới. Nó sẽ tạo một tệp HTML cho dự án web tĩnh hiện tại.
  

  
  

  Tại thời điểm này, chúng tôi đã hoàn tất thành công thiết lập phát triển cho lập trình JavaScript với cấu trúc dự án như trong ảnh chụp màn hình bên dưới

  Trong phần tiếp theo, chúng ta sẽ viết chương trình JavaScript đầu tiên bằng thiết lập này

  Viết chương trình JavaScript đầu tiên của tôi trong Eclipse IDE

  ---

  Trong phần trước, chúng tôi đã tạo một tệp HTML có tên myJavascriptProgram. html. Bây giờ là lúc viết chương trình JavaScript đầu tiên

  Hãy viết đoạn mã JavaScript sau trong trình chỉnh sửa như hình bên dưới rồi lưu lại

  In the above JavaScript program, we have placed some JavaScript code between the opening body tag and closing body tag of the HTML file.

  Trong phần tiếp theo, chúng ta sẽ tìm hiểu cách chạy một chương trình Javascript trong Eclipse IDE

  Làm cách nào để chạy mã JavaScript trong Eclipse IDE?

  ---

  Để chạy mã chương trình JavaScript trong Eclipse, nhấp chuột phải vào myJavascriptProgram và điều hướng đến Mới -> Mở bằng -> trình duyệt web và nhấp vào nó như hình bên dưới

  
  
  Eclipse sẽ mở trình duyệt web trong trình soạn thảo và hiển thị đầu ra sau

  Output of code:
             Welcome to my first JavaScript program
  

  Tạo tệp bên ngoài JavaScript bằng Eclipse IDE

  ---

  Có các bước sau để tạo tệp bên ngoài JavaScript trong Eclipse như sau

  Bước 1 . Tạo một tệp mới để viết mã JavaScript bằng cách chọn Mới rồi chọn Tệp từ menu Tệp.

  Hộp thoại Tệp mới sẽ mở ra nơi chúng tôi sẽ viết myscript. js trong hộp văn bản Tên tệp, như được hiển thị bên dưới và nhấp vào nút Kết thúc

  Bước 2 . Eclipse sẽ thêm một tệp JavaScript trống mới có tên là “myScript. js” vào dự án của bạn. Nếu tệp này không tự động mở trong trình chỉnh sửa, hãy nhấp chuột phải vào tệp myScript. js trong Project Explorer, chọn Mở bằng, rồi bấm vào Trình soạn thảo văn bản.

  Bây giờ bạn sẽ thấy hai tệp có tên là “myJavascriptProgram” và “myScript. js” trên màn hình

  Bước 3 . Viết đoạn mã sau vào tệp JavaScript có tên “myScript. js” và lưu nó bằng Ctrl + S. Bạn cũng có thể lưu nó bằng cách chọn Save từ menu File.

  document.write("Creating an external JavaScript file in Eclipse");
  

  Bước 4 . Bây giờ hãy thêm đoạn mã sau vào tập lệnh “myJavascriptProgram. html” và lưu lại. Trong đoạn mã, src là một thuộc tính và “myScript. js” là giá trị của thuộc tính src. Chúng tôi đã thêm thuộc tính src vào thẻ mở

  Cấu trúc mã hoàn chỉnh được đưa ra dưới đây

  Bước 5 . Nhấp chuột phải vào chương trình myJavascript. html trong Project Explorer và điều hướng đến Mở bằng, sau đó bấm vào Trình duyệt web.

  Eclipse sẽ mở một cửa sổ trình duyệt trong trình soạn thảo, nơi bạn sẽ thấy đầu ra của đoạn mã trên trang web

  Output of code:
               Creating an external JavaScript file in Eclipse
  

  Đây là tài liệu cơ bản về phát triển JavaScript với Eclipse đã hoàn thành. Ngoài ra, nếu bạn muốn biết thêm thông tin, tôi khuyên bạn nên truy cập trang web Eclipse

  ---

  Hy vọng rằng hướng dẫn này đã bao gồm gần như tất cả các bước quan trọng liên quan đến cách viết chương trình JavaScript trong Eclipse IDE. Tôi hy vọng rằng bạn sẽ hiểu cách chạy JavaScript trong nhật thực

  Chúng ta có thể tạo tệp JavaScript trong Eclipse không?

  Nhấp chuột phải vào dự án và chọn Mới -> Khác. Trong Trình hướng dẫn mới, điều hướng đến Thư mục web và mở rộng nó để hiển thị mục nhập JavaScript. Chọn JavaScript và nhấp vào Tiếp theo. Nhập tên tệp vào trường Tên tệp và nhấp vào Kết thúc

  Làm cách nào để chạy một dự án JavaScript trong Eclipse?

  Làm cách nào để chạy mã JavaScript trong Eclipse IDE? . Eclipse sẽ mở trình duyệt web trong trình soạn thảo và hiển thị đầu ra sau. right-click on myJavascriptProgram and navigate to New -> Open with -> web browser and click on it as shown below. Eclipse will open the web browser in the editor and display the following output.

  Làm cách nào để thiết lập JavaScript trong Eclipse?

  Dự án JavaScript đầu tiên của bạn với Eclipse . Select View File New Static Web Project. Tạo một tệp HTML mới với Tệp Mới Tệp HTML Web Khác. Điều chỉnh mã HTML như sau. Trong ví dụ này, JavaScript được nhúng vào trang HTML.

  Làm cách nào để thêm thư viện JavaScript vào Eclipse?

  Tab thư viện .

  Nhập tên cho thư viện bạn muốn thêm và nhấp vào OK. Tên thư viện sẽ được thêm vào danh sách Thư viện người dùng. .

  Chọn tên từ danh sách và nhấp vào 'Thêm. js. .

  bên trong. .

  Các tệp JavaScript sẽ được thêm vào Thư viện người dùng của bạn