JavaScript开发新玩法！VSCode助你飞起，轻松配置、自由编码

JavaScript变火了以后，越来越多人用Visual Studio Code写代码啦～这个是微软出品的超强大又轻巧的编辑器，支持所有各种编程语言和框架，当然也少不了我们最喜欢的JavaScript!赶快学起来，让VSCode帮你把JavaScript开发环境配置的美滋滋儿，编码瞬间飞起！

安装VSCode

别发呆！快上官网下载个VSCode下来。搞定后安装完毕，打开它，找到你的JS项目文件夹。这样的话，你就能开始自由发挥了，不管是改还是调，随你！

调整编辑器设置

想让VS Code用起来更舒服？赶紧弄一下编辑器设定！往上找文件>首选项>设置这三个菜单，里面有个JSON格式的文件可以用来调编辑器。给大家推荐几个好用的设定：

-“Editor.autoIndent”:搞定这设置，手动缩进？不用担心了

-“乖乖自动排版”：选中这个功能，让软件帮你整理代码！

安装必要的扩展

你会不会用VSCode？里头那个扩展功能就是个编程小助手，超好用的。我来给你推荐几个，装上之后，你的JS编程就能如虎添翼！

ESLint就是个给你纠错、提意见的小能手。别担心，安装超简单！在VSCode中，按下“Ctrl+Shift+X”（Win/Lin）或“Cmd+Shift+X”（Mac），找到“ESLint”后点击那个“install”就好！

试试Hamlet！这玩意儿可以让我们的代码看起来更整洁漂亮，输入”Hamlet”并选择”安装”，瞧，瞬间好看多了！

– Chrome调试器怎么用？简直就是无敌利器！Vs Code和Chrome完美搭配，让开发变得轻松不少～装上它也挺容易的，跟前两个差不多。

创建调试配置

调试模式就是搞定JavaScript问题的小帮手，好用得不行！别忘了打开“调试器”功能，有个“生成起始方案”的按钮。没错，选“Node.js”肯定对头，咱不都在用Node.js吗？至于具体设置得根据你的实际情况这儿给你一个超实用的JS调试模式贴士，抓紧去试试看！

{

“version”:”0.2.0″,

“configurations”:[

{

“type”:”chrome”,

“request”:”launch”,

“名字”:”敲个’localhost’，马上启动Chrome。”,

网址：http://localhost:8080

"version": "0.2.0",
"configurations": [
    {
        "name": "Chrome",
        "type": "chrome",
        "request": "launch",
        "url": "http://localhost:8080",
        "webRoot": "${workspaceFolder}"
    },
    {
        "name": "Node.js",
        "type": "node",
        "request": "launch",
        "program": "${workspaceFolder}/index.js"
    }
]

“webRoot”:”你的工作区域文件夹”.

}

]

}

使用调试器进行调试

设置完调试参数后，赶紧开始查看和调试JavaScript代码！只要敲击”F5″，然后你选哪个调试工具（Chrome或Node.js都没问题）它就会自动开始运行。接着，你就能愉快地检查断点、看看变量的值。这个调试神器可是能帮你准确找到并解决程序中的小毛病~

搞定 VS Code JS 环境设定以后，写代码、调代码都变得简单快捷起来，干起活来效率自然提升！掌握好基本操作，你会发现真的可以提速，而且团队合作也会变得更加顺畅！