Cocos Creator代碼編輯環境配置

1，可以使用較為適合js的webstorm，亦可以采用VS；

2，若需要webstorm，在下載之后，在文件，設置內外部編輯器選用webstorm.exe，即可；

3，Visual Studio Code【參考來源：官方文檔】

Visual Studio Code （以下簡稱 VS Code）是微軟新推出的輕量化跨平台 IDE，支持 Windows、Mac、Linux 平台，安裝和配置非常簡單。通過下面介紹的設置方法，使用 VS Code 管理和編輯項目腳本代碼，可以輕松實現語法高亮、智能代碼提示等功能。

安裝 VS Code

前往 VS Code 的 官方網站，點擊首頁的下載鏈接即可下載。

Mac 用戶解壓下載包后雙擊 Visual Studio Code 即可運行。

Windows 用戶下載后運行 VSCodeSetup.exe 按提示完成安裝即可運行。

安裝 Cocos Creator API 適配插件

在 Cocos Creator 中打開你的項目，然后選擇主菜單里的 開發者 -> VS Code 工作流 -> 安裝 VS Code 擴展插件。

該操作會將 Cocos Creator API 適配插件安裝到 VS Code 全局的插件文件夾中，一般在用戶 Home 文件夾中的 .vscode/extensions 目錄下。這個操作只需要執行一次，如果 API 適配插件更新了，則需要再次運行來更新插件。

安裝成功后在 控制台 會顯示綠色的提示：VS Code extension installed to ...。這個插件的主要功能是為 VS Code 編輯狀態下注入符合 Cocos Creator 組件腳本使用習慣的語法提示。

在項目中生成智能提示數據

如果希望在代碼編寫過程中自動提示 Cocos Creator 引擎 API，需要通過菜單生成 API 智能提示數據並自動放進項目路徑下。

選擇主菜單的 開發者 -> VS Code 工作流 -> 更新 VS Code 智能提示數據。該操作會將根據引擎 API 生成的 creator.d.ts 數據文件復制到項目根目錄下（注意是在 assets 目錄外面），操作成功時會在 控制台 顯示綠色提示：API data generated and copied to ...。

對於每個不同的項目都需要運行一次這個命令，如果 Cocos Creator 版本更新了，也需要打開您的項目重新運行一次這個命令，來同步最新引擎的 API 數據。

注意：從 VS Code 0.10.11 版開始，需要在項目根目錄中添加 jsconfig.json 設置文件才能正確的使用包括智能提示在內的 JavaScript 語言功能，在執行上面的命令時，預設的 jsconfig.json 文件會和 creator.d.ts 一起自動拷貝到您的項目根目錄中。

使用 VS Code 打開和編輯項目

現在可以運行我們之前下載安裝好的 VS Code 了，啟動后選擇主菜單的 File -> Open...，在彈出的對話框中選擇您的項目根目錄，也就是 assets, project.json 所在的路徑。

現在新建一個腳本，或者打開原有的腳本編輯時，就可以享受智能語法提示的功能了。

注意 creator.d.ts 文件必須放在 VS Code 打開的項目路徑下，才能使用智能提示功能。

設置文件顯示和搜索過濾

在 VS Code 的主菜單中選擇 文件 -> 首選項 -> 設置，這個操作會打開用戶配置文件，在配置文件中加入以下內容：

{
    "search.exclude": {
        "**/node_modules": true,
        "**/bower_components": true,
        "build/": true,
        "temp/": true,
        "library/": true,
        "**/*.anim": true
    },
    "files.exclude": {
        "**/.git": true,
        "**/.DS_Store": true,
        "**/*.meta": true,
        "library/": true,
        "local/": true,
        "temp/": true
    }
}

上面的字段將為 VS Code 設置搜索時排除的目錄，和在文件列表中隱藏的文件類型。由於 build, temp, library 都是編輯器運行時自動生成的路徑，而且會包含我們寫入的腳本內容，所以應該在搜索中排除。而 assets 目錄下的每個文件都會生成一個 .meta 文件，一般來說我們不需要關心他的內容，只要讓編輯器幫我們管理這些文件就可以了。

使用 VS Code 激活腳本編譯

使用外部文本編輯器修改項目腳本后，要重新激活 Cocos Creator 窗口才能觸發腳本編譯，我們在新版本的 Creator 中增加了一個預覽服務器的 API，可以通過向特定地址發送請求來激活編輯器的編譯。

安裝 cURL

首先需要確保你的操作系統中可以運行 cURL 命令，如果在 Windows 操作系統的命令行中運行 curl 提示找不到命令，則需要先安裝 curl 到你的系統：

• 前往 http://www.confusedbycode.com/curl/
• 點擊下圖箭頭所示的控件，完成人機身份驗證（若無法正常顯示控件，請科學上網）
• • 點擊 curl-7.46.0-win64.exe 開始下載並安裝

  安裝時請使用默認設置，安裝完成后可以打開一個命令行窗口，輸入 curl，如果提示 curl: try 'curl --help' or 'curl --manual' for more information 就表示安裝成功了。

  添加 VS Code 編譯任務

  要在 VS Code 中激活腳本編譯，需要執行以下的工作流程：

  1. 在 Creator 編輯器主菜單里執行 開發者 -> VS Code 工作流 -> 添加編譯任務。該操作會在項目的 .vscode 文件夾下添加 tasks.json 任務配置文件。
  2. 在 VS Code 里按下 Cmd/Ctrl+p，激活 快速打開 輸入框，然后輸入 task compile
  3. 任務運行成功的話，會在 VS Code 窗口下方的輸出面板中顯示如下結果

VS Code 還可以為任務配置快捷鍵，請打開主菜單的 Code -> 首選項 -> 鍵盤快捷方式，並在右側的 keybindings.json 里添加以下條目：

[
    {
        "key": "ctrl+p", //請配置自己習慣的快捷鍵 "command": "workbench.action.tasks.runTask", "args": "compile" } ] 

接下來就可以在 VS Code 里一鍵完成項目腳本編譯了！更多關於 VS Code 中配置和執行任務的信息，請參閱 Integrate with External Tools via Tasks 文檔。

使用 VS Code 調試原生工程

VS Code 調試原生工程請查閱 原生平台調試，不過僅支持 Creator v1.6 及以下版本。如果 Creator 版本大於 v1.7，則要借助 Chrome 或 Safari 進行調試，請參考 原生平台 JavaScript 調試。

學習 VS Code 的使用方法

前往 VS Code 官網的 文檔頁面，了解從編輯功能操作、個性化定制、語法高亮設置到插件擴展等各方面的使用方法。

給一個鏈接：講的是配置vs的https://blog.csdn.net/LANGZI7758521/article/details/81213445

若webstorm在編寫代碼的時候還是沒有提示，那么可以按以下步驟試：

1，進入到Cocos Creator按照目錄下，將resources文件夾下復制到一個新的文件夾下（里面有很多是引擎用不到的，當然也可以直接使用這個文件夾）

 

2，新文件夾下內容如下，

 

3,webstorm設置

點擊File-->進入setting-->在選擇框內搜索libraries，選擇后，點擊右側的“Add”;

 name處隨便起一個名字，選擇Global,之后點擊“+”，選擇最初設置的文件夾，點擊“OK”即可；