bitbucket+Sublime Text 2配置跨平台的nodejs开发环境

由于我这个应用会在三台电脑上开发,winXP,win7,mac,所以开发环境要考虑两个问题,一是同步,而是软件差异性,同步我采用git的方式把代码托管到 https://bitbucket.org/,换电脑前先push。地址:https://bitbucket.org/voidmansun/sc_nodejs

软件方面我建议nodejs的ide用Sublime Text 2,为什么要用这个呢,我主要用的他下面的特性:代码高亮,自动补全,丰富的插件,跨平台

如此神器,肯定要用下试试,下载地址在这里,建议还是不要安装nodejs插件,会干扰原先的自动补全功能。

我装了3个,jade:jade语法高亮,Bracket Highlighter:括号,引号匹配,JS Format:js格式化。ps:windows下建议用powercmd代替cmd。

 

Sublime Text 2 入门及技巧

看了 Nettuts+ 对 Sublime Text 2 的介绍,立刻就兴奋了,诚如作者 Jeffrey Way 所说:“《永远的毁灭公爵》都发布了,TextMate 2 还没发”,你还能指望它么?TextMate 开发者的消极态度已经无法让人忍受了。而作为一款跨 OS X、Linux 和 Windows 三大系统平台的文字编辑器,Sublime Text 2 功能日进,大有取 TextMate 而代之的势头,

以下就将 Nettuts+ 的这篇文章做一粗略翻译,固然不是面面俱到,用做入门却是足够了。以下均是以 Mac 版本为主,但对 Windows 和 Linux 版来说也是相通的。

换个耐看点些的图标

Sublime Text 2 目前还处于测试阶段,默认的黑方块图标看起来实在不够养眼,Nate Beaty 制作了一个不错的替代品。

Mac 下的替换方法:

    在 应用程序 目录中找到 Sublime Text 2,按住 Ctrl 并点击之,在弹出的菜单中选择“显示包内容”。
    进入 Contents/Resources/ 目录,用新下载的图标替换 Sublime Text 2.icns。

尝试开发版本

Sublime Text 2 目前更新十分活跃,如果想要尝试最新的功能,建议下载并安装 dev 版本。

快捷的命令面板

和 TextMate 类似,Sublime Text 2 也提供了很方便的命令调用方式:Command Palette(命令面板)。调用方法:直接在 Tool 菜单中选择 Command Palette,或是用快捷键:Shift + Command + P,输入命令名称(中的字母)就可以实时搜索到相应的命令、选项、snippet 和 syntex, 按下回车就可以直接执行,减少了查找的麻烦。

即时的文件切换

按下 Command + P(Mac) 或是 Ctrl + P(Windows),输入想要切换到的文件的文件名,都不用按下回车键,目标文件就已经展现在眼前了,虽然 Vim 配合 PeepOpen 也可以实现同样的功能,但速度却远没有这么迅速。

随心所欲的跳转

Cmd+P 之所以被叫做 Goto Anything 并不是虚名:

    用 Command+P 可以快速跳转到当前项目中的任意文件,可进行关键词匹配。
    用 Command+P 后 @ (或是Command+R)可以快速列出/跳转到某个函数(很爽的是在 markdown 当中是匹配到标题,而且还是带缩进的!)。
    用 Command+P 后 # 可以在当前文件中进行搜索。
    用 Command+P 后 : (或是Ctrl+G)加上数字可以跳转到相应的行。
    而更酷的是你可以用 Command+P 加上一些关键词跳转到某个文件同时加上 @ 来列出/跳转到目标文件中的某个函数,或是同时加上 # 来在目标文件中进行搜索,或是同时加上 : 和数字来跳转到目标文件中相应的行。

多重选择(Multi-Selection)

多重选择功能允许在页面中同时存在多个光标,让很多本来需要正则表达式、高级搜索和替换才能完成的任务也变得游刃有余了。看看 Nettut+ 提供的实例可能更为直观一些:

激活多重选择的方法有两几种:

    按住 Command 或 Alt,然后在页面中希望中现光标的位置点击。
    选择数行文本,然后按下 Shift + Command + L。
    通过反复按下 Control/Command + D 即可将全文中与光标当前所在位置的词相同的词逐一加入选择,而直接按下 Alt+F3(Windows) 或是 Ctrl+Command+G(Mac) 即可一次性选择所有相同的词。
    按下鼠标中键来进行垂直方向的纵列选择,也可以进入多重编辑状态。

缩进指示(Indent Guide)

    缩进指示已经被集成进 Sublime Text 2 中,不需要安装插件了。

缩进指示这个小功能可以让代码的层级关系更加清晰,在 Sublime Text 2 中,可以通过一个插件来实现这个功能。

安装方法:

    下载 IndentGuides 插件。
    解压后,将文件夹重命名为 Indent Guides,并放入 Packages 目录中。找到 Packages 目录的简单方法是在 Sublime Text 2 的 Preferences 菜单中选择 Browse Packages。
    重启 Sublime Text 2

安装包控制(Package Control)

上一条中的安装插件的方法是不是很麻烦呢?其实和 TextMate 可安装 Bundle、Plugin 一样,Sublime Text 2 也拥有良好的扩展功能,这就是安装包(Package);同样,就像 TextMate 有用来安装、升级、卸载 Bundle 的 GetBundles 一样,Sublime Text 2 也有其用来进行 Package 控制的插件:Sublime Package Control。通过 Sublime Package Control,安装、升级和卸载 Package 也变得轻松写意了。

安装 Package Control 的方法:

    打开 Sublime Text 2,按下 Control + ` 调出 Console

    将以下代码粘贴进命令行中并回车:

    import urllib2,os; pf='Package Control.sublime-package'; ipp = sublime.installed_packages_path(); os.makedirs( ipp ) if not os.path.exists(ipp) else None; urllib2.install_opener( urllib2.build_opener( urllib2.ProxyHandler( ))); open( os.path.join( ipp, pf), 'wb' ).write( urllib2.urlopen( 'http://sublime.wbond.net/' +pf.replace( ' ','%20' )).read()); print( 'Please restart Sublime Text to finish installation')

    Sublime Text 3 请使用以下代码:

      import urllib.request,os; pf = 'Package Control.sublime-package'; ipp = sublime.installed_packages_path(); urllib.request.install_opener( urllib.request.build_opener( urllib.request.ProxyHandler()) ); open(os.path.join(ipp, pf), 'wb').write(urllib.request.urlopen( 'http://sublime.wbond.net/' + pf.replace(' ','%20')).read())

    重启 Sublime Text 2,如果在 Preferences -> Package Settings中见到Package Control这一项,就说明安装成功了。

使用 Package Control 安装 Package 的方法将在后面用到的地方详述。

对齐

对于某些喜欢整齐的码农来说,看到下面这种情况可能是让其无法忍受的:

var joe = 'joe';
var johnny = 'johnny';
var quaid = 'quaid';

一定要改成这样才会安心:

var joe    = 'joe';
var johnny = 'johnny';
var quaid  = 'quaid';

TextMate 里也有这样的功能(Option + Command + ])可以自动实现以上的对齐过程,而在 Sublime Text 2 之中,一个 Sublime Alignment 插件也可以轻松实现。

以下就通过 Package Control 来安装这个插件:

    按下 Shift + Command + P 调出命令面板。

    输入 install 调出 Package Control: Install Package 选项,按下回车。

    在列表中找到 Alignment,按下回车进行安装。

    重启 Sublime Text 2 使之生效。现在通过选中文本并按下 Shift + Command + A Ctrl + Command + A 就可以进行对齐操作了。

通过这个方法就可以简便的安装更多的插件,虽然目前的安装源中插件并不是很多,但相信以后会更加丰富的。

Vim 模式

是的,Sublime Text 2 dev 版已经支持 Vim 的编辑模式了,如果更喜欢 Vim 的编辑模式,可以通过以下方法来激活 Vintage mode:

    按下 Shift + Command + P 调出命令面板。

    输入 settings user 调出 Preferences:Settings - User,并按下回车。

        以上两步也可以直接用cmd + ,完成。

    这时会打开一个 Preferences.sublime-settings 的文件,如果是第一次修改,它应该是个空文件,把以下文本粘贴进去:

    {
        "ignored_packages": []
    }

    保存这个文件,这时按下 ESC 键,再按下一些你熟悉的 Vim 命令,是不是很有亲切感?

无干扰模式(Distraction Free Mode)

现在的编辑器如果没有一个无干扰模式似乎都说不过去了,在 Sublime Text 2 中,只要按下 Control + Shift + Command + F 或是在菜单 View 中选择 Enter Distraction Free Mode 就可以进入这个 UI 最小化模式了。如果是在用 Mac OS X Lion 的话,Sublime Text 2 还同时支持 Lion 的原生全屏模式。

通过修改 “Preferences” -> “File Settings - More” -> “Distraction Free - User” 可以对防干扰模式进行一些设置:

{
    "line_numbers": false,      //是否显示行号
    "gutter": false,            //是否显示边列
    "draw_centered": true,      //是否居中显示
    "wrap_width": 80,           //换行宽度(单位:字符)
    "word_wrap": true,          //是否自动换行
    "scroll_past_end": true     //滚动能否超过结尾
}

TextMate Bundle

Sublime Text 2 很给力的一点就是它同时支持一些 TextMate 的 Bundle。

Sublime Text 2 对于 TextMate Bundle 中的 Snippet 有着良好的原生支持,把 Bundle 放到 Packages 目录里就能用。但对 Bundle 中的 command 并不支持,此外,TextMate 的色彩主题 [1] 也是可以放到 Packages 目录里直接用的。估计随着 Sublime Text 2 越来越火,会有更多 TextMate 的 Bundle 被移植过来。

主题

这里所讲的主题不同于针对代码的 Color Scheme,是指针对 Sublime 程序本身的主题,目前可以安装的是 Ian Hill 的 Soda。

因为源中已经添加,所以这款主题的安装同样可以通过 Package Control,非常方便。目前 Soda 主题提供了明暗两种风格。

激活方法,同样要修改 Preferences:Settings - User:

    按下 Shift + Command + P 调出命令面板。

    输入 user settings 调出 Preferences:Settings - User,并按下回车。

    themetheme

    添加以下代码激活 Soda Light 主题:

    {
        "theme": "Soda Light.sublime-theme"
    }

    添加以下代码激活 Soda Dark 主题:

    {
        "theme": "Soda Dark.sublime-theme"
    }

    保存生效。

命令行工具

和 TextMate 和 MacVim 一样,Sublime Text 2 也提供了很方便的命令行工具以方便通过终端来快速的调用 Sublime Text 2 程序来打开文件/目录/项目等。

要使用命令行工具,你需要创建一个符号链接,在终端(Terminal.app)中运行:

ln -s "/Applications/Sublime Text 2.app/Contents/SharedSupport/bin/subl" ~/bin/subl

然后运行 subl --help 可以查看 subl 命令的使用方法:

使用: subl [参数] [文件] 编辑指定文件
或: subl [参数] [目录]    打开指定目录
或: subl [参数] - 编辑 stdin

可用参数:
--project <项目>: 读取指定项目
--command <命令>: 运行指定命令
-n 或 --new-window: 打开新窗口
-a 或 --add: 向当前窗口中添加文件夹
-w 或 --wait: 等待文件关闭后再返回
-b 或 --background: 不激活程序窗口
-s 或 --stay: 关闭文件后保持程序窗口激活
-h 或 --help: 显示此帮助
-v 或 --version: 显示版本号

读取 stdin 时会使用 --wait 参数。通过 --stay 可以在文件关闭后不返回终端(仅针对单个文件)。

可以通过向文件名添加 `:行号` 或 `:行号:列号` 后缀来打开到更具体的位置。

总结

在试用 Sublime Text 2 的过程中,“快”和“顺”是给 Lucifr 最强烈的感受,就如同 Chrome 浏览器一样,Sublime 的各种操作都给人以很流畅的感受。良好的中文支持也是 TextMate 所不具备的,虽然以目前的插件数量和质量还不能完全替代 TextMate,但还是让人十分期待的。唯一让人纠结的是价格,$59 的注册价确实不便宜(明显是照着 TextMate 的 $58 加一块定的嘛),好在目前测试阶段还可以无限试用。

时间: 2024-07-31 10:53:40

bitbucket+Sublime Text 2配置跨平台的nodejs开发环境的相关文章

Sublime Text 3配置Windows下C/C++编译环境

在Linux或者Mac OS中我们选择[工具 / 编译系统 / C++(Tools / Build System / C++)]就可以配置C/C++的编译环境,但是在Windows环境下,我们却需要做更多的设置 首先我们需要设置MinGW编译器的环境变量,使我们可以直接使用gcc/g++命令,这点我们就不重复了,不会的请大家自行脑补 我们直接讲Sublime Text的配置方法 工具 / 编译系统 / 编译新系统(Tools –> Build System –> New Build Syste

nodejs开发环境配置与使用_node.js

先说下nodejs这个哦,有人以为它是一种语言,其实不是,它是一个平台,一个建立在google的V8引擎上的js运行平台,就是解析js,并提供自己 的一些API给用户调用.从目前的情况来看,这个发展情况还算好,明天都有好多的前端后台工程师在加入,连一些大神也在关注甚至写博客,昨晚我还看见一篇 文章写道一个外国的网站写了将近90搞nodejs的web插件,这个真牛啊!那学习中国东东对于我们来说最直接的能带来什么利益呢:前端人员由于熟悉 js那么可以基本简单学习下linux就可以上手了,那后台工程师

怎样在Ubuntu系统下配置Ruby On Rails开发环境

在Linux下使用Ruby On Rails能够对web应用程序的维护和开发变得更加便利,让开发人员能更加专注于系统的逻辑结构,在使用前需先配置Ruby On Rails的开发环境,下面小编就给大家介绍下Ubuntu 12.04如何配置Ruby On Rails开发环境. Ubuntu 12.04 + Ruby 2.0 + Rails 3.2.13 1.安装系统需要的包 $ sudo apt-get install -y build-essential openssl curl libcurl3

搭建eclipse的nodejs开发环境图解

我们在前面的文章中学习了nodejs如何使用,以及一些基础理论. 工欲善其事必先利其器,这篇文章主要是教搭建eclipse的nodejs开发环境. Q:谁适合阅读此文章? A:已经非常熟练使用eclipse的开发者. [注意:前提是你已经安装了nodejs.exe] 首先,我们需要下载一个eclipse,我这里下载的是目前的最新版本. [下载eclipse Standard 4.3.1 (32位)] http://www.eclipse.org/downloads/packages/eclips

将Sublime Text 2配置为Java的IDE的教程_java

Sublime Text 2 是我最喜欢用来编码的文本编辑器,如果你尝试使用后相信你也会喜欢上它的.在这篇文章中我们将讨论如何在 Sublime Text 2 中编译和运行 Java 程序. 第一步:设置 Java PATH 变量 这是第一步也是最基本的一步,用来设置编译和运行 Java 程序基本命令如 javac 和 java 的存放路径. 在 Windows 下设置 PATH 路径的步骤:     右键"我的电脑"     选择"属性"     进入高级系统设置

win7下安装配置node.js+express开发环境_node.js

1.安装 node.js. 进入官网的下载地址:http://www.nodejs.org/download/ . 选择Windows Installer或者选择Windows Installer (.msi) 32-bit,下载安装包. 下载完成后,双击安装. 2.安装 Express. 通过nmp包管理器进行安装,安装分为: 全局安装:自动安装到"C:\Users\[当前用户]\AppData\Roaming\npm"下,并且自动将路径添加到环境变量"Path"

windows7安装配置phonegap3.0 (cordavo)开发环境教程

  公司用的是windows7,所以不得不再进行一次windows下的配置工作,顺便也写下来了 主要麻烦的地方是要在win7下添加好几个环境变量,这一块地方特别要小心添加,步骤挺多的,给你打镇强心剂,看最终成功运行效果先,我还测试集成了某个广告联盟的SDK,如图: 开发环境教程-avocode for windows"> 开始吧... 注意:我下面如果给出的官方下载地址,请您自行去下载,因为我的win7是64位的,可能与你的有点不同.你得下载正确的安装包 1.下载nodeJS,并安装 一步

用Shell脚本快速搭建Ubuntu下的Nodejs开发环境_linux shell

nodejs的确是很火,以前倒腾过,但是从来没有认真记录下什么.在ubuntu下搭建它的开发环境尝尝鲜,有一个捷径,它能让系统自动帮你安装所需要的东西,我们生成一段shell脚本,让它来完成以下工作: 安装 git下最新的node,node包管理器,Forever和Cloud9IDE工具(可选),mongodb 10gen:注:脚本的正常运行需要比较新版本的Ubuntu,而且需要联网,因为它会连接网络去下载所有的依赖包顺序安装. 1.脚本代码: 复制代码 代码如下: #!/bin/shecho

快速配置Linux + Eclipse + wxWidgets开发环境

本文为原创,如需转载,请注明作者和出处,谢谢!     wxWidgets是一个跨平台的C++开发库,与MFC类似.不过配置起来比较麻烦,如果在Linux下使用Eclipse来开发基于wxWidgets的应用程序需要进行一系列的配置,如设置include路径.library路径等.但我们可以使用一个简单的方法来快速配置wxWidgets.     在wxWidgets发行发中有很多例子,随便编译一个例子(执行make命令),就会在终端中看到生成.o和可执行文件的完整命令.如果要编译自己写的程序,