sublime 插件开发初面-open with browser with IE/Chrome

sublime 插件开发初面-open with browser with IE/Chrome

 

前端也混了半年多了， 不忘sublime的功劳！这等神器？小弟浅知，暂且保留问号。特别想开发几个插件玩玩。

 

感谢这篇文章提供的支持

http://ux.etao.com/posts/549 sbulime 插件api （手册）

 

前言：

sublime text 2 的扩展模式相当的丰富。 修改语法高亮，菜单模式，自动补全，语言定义，代码片段，宏定义快捷键，鼠标绑定，插件。所有的这些都是通过文件构成的包来实现。

 

包在Packages目录下。 可以看到该目录下已经默认有了很多包。 其中的大部分的包都是跟特定语言相关的。有两个比较特殊：Defautl和User. Default包含了所有标准的键盘绑定，菜单定义，文件配置和一大堆用python写的插件。User总在最后加载。通过在User里面的自定义文件，在允许用户重写所有默认行为。

 

同时Default里面是个很好的参考，可以掘墓下前人是如何做的，那些事可能实现的。

 

sulime 插件需要python环境，它内置了python环境，其实控制台就是python控制台。可以查看内置的python版本。我的sublime版本 2217，内置python版本是2.6.5

>>>import platform

>>>platform.python_version()

2.6.5

 

 

ok，开始写个简单的插件玩玩

 

一第一个插件hello word

Tools > New Plugin 创建一个插件模板如下。

 

import sublime, sublime_plugin 

class MyPlugCommand(sublime_plugin.TextCommand): 

    def run(self, edit): 

        self.view.insert(edit, 0, "Hello, World!")

 

保存的时候要创建一个包。可以放在User目录下，也可以选择一个自己的包保存。

取名MyPlug.py，放在Packages目录下 Packages/myplug/MyPlug.py 

 

调出sublime控制台，输入 view.run_command('my_plug')。

注意这里是 my_plug。把驼峰格式转换成下划线格式。

 

注我们会看到当前文本在前面插入了hellow word!

 

 

二sublime 右键菜单 Open in Browser

sublime右键有个 open in Browser选项，使用默认浏览器打开本地页面。

open in Browser 执行的是 Packages/Default/open_in_browser.py 文件，可以参考里面的写法。

run 是模块启动入口， is_visible 是否展示在右键菜单。

 

三添加右键选项Open in IE Browser / Open in Chrome Browser

我们先创建一个包在 Packages/openBrowser， 这里就是我们插件的目录了。

打开 Packages/Default/Content.sublime-menu 可以看到里面的配置。 在插件目录下创建一个同样文件名的文件openBrowser/Content.sublime-menu， 写入：

 

[
    { "caption": "-", "id": "file" },
    { "command": "open_browser", "caption": "Open in IE Browser", "args":{"browser":"IE"} },
    { "command": "open_browser", "caption": "Open in Chrome Browser", "args":{"browser":"Chrome"} }
]

 

open_browser 是我们将要创建的py插件名。

可以看到右键已经出现了

 

 

四创建openBrowser.py

在上面的plug模板稍微修改下，通过右键菜单传入的参数browser来判断用什么浏览器。

我想要用IE Chrome Firefox 打开页面。（PS:python 语法的使用不多介绍，主要是如何写个插件）

 

>>>import webbrowser

>>>webbrowser.get('chrome').open_new_tab(url) 

 

不过webbrowser提供的内置模块只有一个默认的浏览器和IE，输入代码

 

>>>webbrowser._browser

 

我们需要用 webbrowser.BackgroundBrowser 来添加浏览器的支持

 

>>> chromePath = 'C:\\Program Files (x86)\\Google\\Chrome\\Application\\chrome.exe'

>>>webbrowser.register('chrome', None, webbrowser.BackgroundBrowser(chromePath))

>>>webbrowser.get('chrome').open_new_tab(url)

 

 

五url匹配规则

我还想要个url替换规则。 如 项目下面的 index.html 转换成 http://www.test.com/index.html

弄个配置

"URLMap":{
      "/openBrowser/":"http://www.test.com/"
 }

匹配代码略

 

 

六配置和代码独立

创建文件/openBrowser/openBrowser.sublime-settings， 写入配置

 

{
     "openBrowser":true,
     "browsermap":{
          "IE":"c:\\program files\\internet explorer\\iexplore.exe",
          "Chrome":"C:\\Program Files (x86)\\Google\\Chrome\\Application\\chrome.exe",
          "FireFox":"E:\\Program Files (x86)\\Mozilla Firefox\\firefox.exe"
     },
     "URLMap":{
          "/openBrowser/":"http://rc.qzone.qq.com/333/"
     }
}

 

读取配置

settings = sublime.load_settings(__name__ + '.sublime-settings')

self.view.settings().set('openBrowser', settings.get('openBrowser'))

 

 

7设置快捷键

创建文件 /openBrowser/Default (Windows).sublime-keymap，写入

 

[
     {
          "keys":["ctrl+shift+b"],"command":"open_browser"
     }
]

 

好吧，到此为止！基本上以上几点凑合起来就是一个比较完整的插件了。

功能很简单，不过刚接触，所有的东西都是新鲜的，用了很多时间去学习和适应。

加油，希望下次能写个更好的插件。