Total Pageviews

Friday, 10 June 2016

在 Sublime Text中直接运行Javascript调试控制台

Sublime Text是深受喜欢的多语言编辑器,很多开发人员都选择它作为自己的主力编辑器进行创作,并且凭借其强大的可扩展性,Sublime Text功能也越来越丰富。

但是有个问题,那就是Sublime Text不支持一些语言的运行,例如javascript,我们通常通过写一个HTML页面来嵌入JS,然后再用Chrome或者Firefox的开发者工具来调试。而实际上我们也可以通过添加Build System的方法来让Sublime Text支持Javascript Console控制台调试.

利用 JSC 添加 JavaScript 控制台 (Mac OS X)

实际上Mac内置了一个javascript控制台程序,但是藏得太深,它在

/System/Library/Frameworks/JavaScriptCore.framework/Versions/A/Resources/jsc

里。实际上你可以在终端里直接运行这个程序,然后在终端进行调试。

为Sublime Text添加此Build System,只需打开Sublime Text,选择 Tools > Build System > New Build System... ,

现在,粘贴以下内容并保存为JSC.sublime-build,或者其他名字:
{

"cmd": ["/System/Library/Frameworks/JavaScriptCore.framework/Versions/A/Resources/jsc", "$file"],

"selector": "source.js"

}
JSC build system

现在,在 Tools > Build System 里选择刚刚创建好的“JSC”,就可以调试了。

你需要做的就是在写好js文件后,按下Command + B按钮。

sublime javascript console

不过这里也要注意,使用JSC时,你需要用debug()替换console.log()函数。

利用 Node.js 添加 JavaScript 控制台

除了Mac的JSC,我们还有强大的Node.js。要使用此方案,请先下载并安装Node.js。

其他的步骤和上述基本一致,只是在编辑新的Build System时,要粘贴的内容是:

{

"cmd": ["node", "$file"],

"selector": "source.js"

}
编辑好后保存为Node.sublime-build或者其他的名字就可以了。

node.js build system

同样,要使用,在 Tools > Build System 里选择刚刚创建好的“Node”,就可以调试了。

你需要做的就是在写好js文件后,按下Command + B按钮。

在Node.js的情况下,你可以继续使用console.log()函数.