由于中有高級語法高亮顯示、智能內容輔助和準確驗證等特性，進行JavaScript編碼不再是一項繁瑣的任務。

MyEclipse技術交流群：742336981 歡迎一起進群討論

JavaScript項目

在 2021及以后的版本中，大多數JavaScript支持都是開箱即用的JavaScript源代碼——不需要特殊的JavaScript Eclipse項目或JavaScript facet。但是官方建議使用jsconfig.json文件來指定項目上下文，這使得在項目中跨多個源文件進行高級JavaScript分析，來增強智能感知、驗證、導航等功能。

MyEclipse可以幫助您創建這個文件，還可以根據需要對其進行進一步調整。

編輯JavaScript源代碼

智能感知

當輸入JavaScript文件時，使用內容輔助快捷鍵(默認為Ctrl/Cmd + Space)來彈出一個提案列表，在輸入觸發字符后也會自動顯示建議。如果可用，JSDoc也將顯示在彈出窗口中。

JSON

智能感知也可用于JSON文件，當編輯普通文件時，您可以獲得內容輔助和開箱即用的文檔；在編輯不太常見的文件時，您還可以通過向JSON中添加“$schema”屬性來鏈接到模式以獲得類似的支持。

自動導入

使用模塊時，內容輔助會建議在項目中找到的導出符號的名稱，使用此建議也會添加導入。

驗證與檢驗

 只有當前在編輯器中打開的文件才會被驗證，您將在編輯器的標尺區域以及Problems/ markers視圖中看到錯誤、警告和信息標記。

注意：對于高級JavaScript驗證，要么確保您的項目有一個jsconfig.json文件，其中checkJS屬性設置為true；要么在文件頂部添加“//@ts-check”注釋。

ESLint

ESLint支持是內置的，但是您必須在項目的根目錄下有一個ESLint配置文件，并且在項目中安裝ESLint——node_modules必須包括ESLint，以及正在使用的任何ESLint插件。例如，在檢查ES2020代碼時，您需要使用Babel解析器。

快速修復

對于一些警告和錯誤，包括限制問題，可以使用快速修復程序。只需將鼠標懸停在彎曲的線條上，就可以看到幾個可能的修復鏈接。

代碼分析和重構

使用Find References操作在當前文件或整個項目中查找對JavaScript結構的引用。

重命名重構允許您在整個項目中重命名這些構造。

導航

Outline視圖

Outline視圖描述了JavaScript編輯器的函數和變量的結構化視圖，讓您快速了解代碼是如何結構化的，單擊Outline中的一個元素來跳轉到代碼中的該部分。

如果視圖在當前透視圖中不可見，請從工具欄中選擇Window>Show view >Other>General>Outline。

快速概述

在編輯JavaScript文件時按Ctrl+O打開Quick Outline，以便在代碼中輕松導航。

用Chrome或Firefox調試JavaScript

通過雙擊標尺區域在源代碼中放置斷點，開發者可以在JavaScript文件中放置斷點，也可以在HTML/JSP文件中嵌入JavaScript。

要創建一個新的調試配置：

1. 從Debug下拉菜單中，選擇Debug Configurations。
2. 創建一個新的Chrome調試/啟動Firefox Debugger配置。
3. 在URL字段中，粘貼應用程序的URL。
4. 在工作目錄字段中，指定項目根目錄的文件系統路徑。
5. 單擊Debug來啟動調試會話。

Chrome調試注意事項：如果Chrome還沒有運行，將啟動Chrome在調試模式，如果Chrome不是在調試模式下運行，點擊調試將重用正在運行的Chrome實例，但JavaScript調試將不起作用。要么使用——remote-debugging-port=9222開關在調試模式下啟動Chrome，要么關閉Chrome，以便它可以使用正確的設置自動啟動。

附錄A: jsconfig.json

在JavaScript項目的根目錄中創建這個文件，該配置文件可用于指定要包含在項目JavaScript上下文中的文件，以及編譯和解析選項。

示例jsconfig.json

{
"compilerOptions": {
"disableSizeLimit": true,
"allowJs": true,
"module": "commonjs",
"target": "es6",
"checkJs": true
}
,
"exclude": ["node_modules"]
}