其实工作中使用过很多的编辑器,比如WebStorm,Sublime Text,国产的HBuilder。最终我还是选择了Visual Studio Code作为我的后续工作中的工具IDE。不仅仅启动速度比WebStorm快速很多,而且插件安装也很方便。并且也是微软出品的,对TypeScript支持度好。对于经常使用nodeJS的工作人员来说,稍加配置,调试起来那真是方便的很。不仅仅软件的界面风格漂亮,使用的体验性也是非常的不错。推荐给大家尝试一下。真的很不错的编辑器。废话不多说了。我们直接开始:
一:先说使用的插件:
当然啦,对于预处理器,大家要安装ruby,然后才是我们的插件功能。
二:调试功能的使用:
对于Visual Studio Code,我最喜欢的就是他的内置nodejs和调试的功能,比如我们调试一段js代码,首先我们要配置我们的调试文件:
{
// 使用 IntelliSense 了解相关属性。
// 悬停以查看现有属性的描述。
// 欲了解更多信息,请访问: https://go.microsoft.com/fwlink/?linkid=830387
"version": "0.2.0",
"configurations": [
{
"name": "谷歌浏览器", //运行html文件,用谷歌浏览器打开
"type": "chrome",
"request": "launch",
"url": "${file}",
"sourceMaps": true,
"webRoot": "${workspaceRoot}"
},
{
"name": "nodeLauch", //单独调试js,即可以直接运行js
"type": "node",
"request": "launch",
"program": "${file}", //这个配置成你要调试的文件、${file}当前打开的文件
"stopOnEntry": false,
"args": [],
"cwd": "${workspaceRoot}",
"runtimeExecutable": null,
"runtimeArgs": [
"--nolazy"
],
"env": {
"NODE_ENV": "development"
},
"console": "internalConsole",
"preLaunchTask": "",
"sourceMaps": false,
"outFiles": null
}
]
}
然后启动我们的调试:
从左往右依次是,调试所在的位置,调试的调试模式和开始开关,断点的位置,控制断点调试的控制按钮。
这样对于nodeJS的调试,那更加方便了,不仅如此,我们还可以打开编辑器的终端:
这里面随时显示我们使用的功能插件和调试文件。和cmd中功能完全一样。这样大大方便了我们对于js的控制和调试。所以Visual Studio Code真是一款不错的编辑器。我已经放弃所有的编辑器,以后就把它当成手中的剑,在互联网的世界闯荡。
其实Visual Studio Code还有很多很多实用的功能,期待我们一起去使用,与所有的前端爱好者共勉........