VSCode配置Laya开发环境

在开发laya游戏时，鉴于VSCode的强大，很多人更愿意用VScode,而不是Laya IDE, 然而代码的编译，调试必须在Laya IDE中进行，如此不断地切换IDE, 在日常开发中是及其难受的，因此如何在VSCode中完成所有的操作，是我们迫切需要的。这里以laya1.x为例。

安装Debugger for Chrome

VScode默认是没有配置调试环境的，需要安装chrome调试插件和配置launch.json来配置调试环境 点击左侧导航面板的扩展商店，然后再搜索栏中输入关键字 chrome, 找到 Debugger for Chrome 点击Install 进行安装

配置launch.json

选择调试环境，使用Chrome 作为调试环境

选择之后，会自动创建调试配置文件 .vscode/launch.json，launch.json的配置如下：

{
    "version": "0.2.0",
    "configurations": [ 
      {
        "name":"chrome调试",
        "type":"chrome",
        "request":"launch",
        "file":"${workspaceRoot}/bin/index.html",
        "runtimeArgs":[
             "--allow-file-access-from-files",
             "--disable-web-security"
          ],
        "sourceMaps":true,
        "webRoot":"${workspaceRoot}",
        "userDataDir":"${workspaceRoot}/.laya/chrome",
        "sourceMapPathOverrides":{
             "src/*":"${workspaceRoot}/src/*"
        }
      }
    ]
}

如果不想创建项目复制launch.json的，直接在.vscode目录创建一个空文件launch.json，将上面的内容复制过去也是可以的。

安装layaair-cmd

npm install layaair-cmd -g

layaair-cmd的使用

layaair-cmd的使用很简单，目前只有2个功能参数，compile与publish，分别为编译与发布。 编译的时候，输入命令行layaair-cmd compile回车即可, 发布的时候，输入命令行layaair-cmd publish

配置VSCode的编译快捷键

尽管命令行让我们避免了切换IDE的频繁操作，但易用性还是不够，直接通过快键键来执行编译和调试，操作更方便。

直接给命令行设置快捷键，VSCode是做不到的，但是可以在任务里去执行命令行，然后设置执行任务的快捷键，并指定默认运行的任务名称，就可以实现VSCode快捷键的绑定。

1 新建任务

在VSCode的终端菜单里，点击 配置任务

点击选择 使用模版创建tasks.json文件的选项

再点击选择运行任意外部命令的示例选项

这时，我们就可以看到，.vscode目录下，一个执行外部命令的任务模板.vscode/task.json创建成功了，我们只需要更改一下label（任务名称）和command（要执行的命令）即可

打开键盘快捷方式后，在顶部搜索框中搜索task，找到运行任务（Run Task）双击，这里设置快捷键Ctrl + E, 搜索Debug:开始调试,设置快捷键Ctrl + R, 搜索重新启动，设置快捷键Ctrl + D(这里的快捷键可以根据自己的喜好设置)。

到这里，我们就可以在VSCode中通过快捷键完成调试，编译Laya项目的操作