sublime text3如何在浏览器预览?

插件: view-in-browser

CTRL + ALT + V 打开浏览器

默认打开firefox,settings里面可修改。

Sublime Text - View In Browser

View In Browser is a Sublime Text plugin that will open whatever is in your current view/tab. If the file current open is new and has not been saved a temporary file is created (in your default temp directory for your OS) with the extension of .htm and your browser will open it. However if the current open file is saved and has a name this plugin will open it in whatever you have set to handle its type.

By default the keystroke assigned to this plugin is CTRL + ALT + V.

Installation

Using the Sublime Text Package Control plugin (http://wbond.net/sublime_packages/package_control) press CTRL + SHIFT + P and find Package Control: Install Package and press Enter. Find this plugin in the list by name View In Browser.

Configuring Browsers

By default this plugin will open files in Firefox. You can configure it to open using another browser of your choice. To do this, choose Settings - User from Preferences > Package Settings > View In Browser.

The browser you wish to use to open files is set in the key named browser. The following is a list of browsers configured for use out of the box.

  • Firefox - Mac OS, Linux, Windows
  • Chrome - Mac OS, Linux, Windows
  • Chrome64 - Windows
  • Yandex - Windows
  • Safari - Mac OS
  • Internet Explorer - Windows
  • Chromium - Linux

Other Browsers

View In Browser also provides key bindings to open your current view in browser other than your browser setting. Below is a listing of the keys and what browser open with those key bindings.

  • CTRL + ALT + F - Firefox
  • CTRL + ALT + C - Chrome
  • CTRL + ALT + I - Internet Explorer
  • CTRL + ALT + S - Safari

Like any other key binding in Sublime these can be changed. Below is an example of the key configuration. You can remap these in your User key bindings configuration file.

[
    { "keys": [ "ctrl+alt+v" ], "command": "view_in_browser" },
    { "keys": [ "ctrl+alt+f" ], "command": "view_in_browser", "args": { "browser": "firefox" } },
    { "keys": [ "ctrl+alt+c" ], "command": "view_in_browser", "args": { "browser": "chrome" } },
    { "keys": [ "ctrl+alt+i" ], "command": "view_in_browser", "args": { "browser": "iexplore" } },
    { "keys": [ "ctrl+alt+s" ], "command": "view_in_browser", "args": { "browser": "safari" } }
]

Windows Considerations

One of the things you may notice in the Windows configuration for chrome is a variable in the command path that looks like: %Local AppData%. This is a reference to your Windows installation‘s AppData folder in your user profile directory. There is a variable there because this value will differ for each user on your computer, and Chrome installs to your AppData folder.

Here is a list of supported variables:

  • AppData - Your main application data folder for your profile (usually roaming)
  • Personal - Your documents location
  • Desktop - The path to your Desktop location (may be unreliable)
  • Start Menu - The path to your Start Menu items location
  • Local AppData - Your local application data folder for your profile
  • My Video - Path to your videos location
  • My Pictures - Path to your pictures location
  • My Music - Path to your music location

Note that many of these are not terribly useful for determining browser location, unless you have decided to install Firefox in your My Music folder.

Configure to View on Local Server

The View In Browser plugin also supports the ability to view files in the context of a local server. So if you have a local Apache, Tomcat, or some other server application running you can configure this plugin to open your file prefixed with a URL.

To configure this the View In Browser plugin reads the configuration of your currently loaded project. You can edit a project file by opening the sublime-project file by choosing Project -> Edit Project. In your project file you will need to specify two things:

  • baseUrl - The root URL to prefix files with
  • basePath - The base path where your site/application lives

Here‘s how that looks.

{
	"folders":
	[
		{
			"path": "/home/<username>/code/python/my-cool-website"
		}
	],
	"settings": {
		"sublime-view-in-browser": {
			"baseUrl": "http://localhost:8080",
			"basePath": "/home/<username>/code/python/my-cool-website"
		}
	}
}

Notice the key named settings which is a dictionary that contains another key named sublime-view-in-browser. This is where you will put your baseUrl and basePath settings.

Now when you activate View In Browser your file will open with the HTTP protocol instead of the FILE protocol.

原文地址:https://www.cnblogs.com/cnfrank/p/9378865.html

时间: 2024-10-03 15:34:11

sublime text3如何在浏览器预览?的相关文章

sublime如何设置支持浏览器预览

我用的text3版,其他版本未试,但应该也有效. 安了个view in browser插件,然而点击预览未起作用. 搜解决方法,发现了另一个插件,sidebar enhancements,设置快捷键预览,非常方便,安装设置方法如下: preferences/pacage control/install pacage/sidebar……ts/,安装完毕: preferences/keybindings user,打开: 在数组框[]中,加入: [ // chrome{ "keys": [

sublime txt 设置在浏览器预览

1. 安装SideBarEnhancements插件 ctrl+shift+p —> Install Package —> 找到SideBarEnhancements 2. 配置预览快捷键 Preferences —> Key Bindings - User 将以下代码复制到数组中.

sublime Text3 设置多个浏览器预览

使用sublime时由于经常要在ie chrome firefox等浏览器中预览,所以很有必要设置多个浏览器预览 步骤: (1)安装SideBarEnhancements插件(用sublime的应该都知道) (2)安装好以后点击工具栏的     preferences > package setting > side bar > Key Building-User键入以下代码 [ { "keys": ["f1"], "command&qu

设置sublime text2/3中默认预览浏览器快捷键的方法

各位前端大神们,大家在用IDE编辑器的时候喜欢用哪些呢?是Dreamweaver.Zend Studio.editplus又或者是sublime text?今天马浩周给大家就要说说设置sublime text2/3中默认预览浏览器快捷键的方法了,可能你早都设置了,(设置好的自动忽略).此篇文章讲给sublime text的使用新手们. 我们为什么要设置默认的预览浏览器呢?因为搞前端的都知道,你在预览的时候不可能只预览一个浏览器,可能需要多个,当然今天我们举例中会说道谷歌浏览器Chrome,IE浏

Atom编辑器折腾记_(5)记住上一次打开的目录及浏览器预览功能实现

简介 用了Atom之后是不是发现,每次打开工作目录,保存退出后重新打开软件,目录一片空白!! Sublime和DW的快捷键预览html功能是不是很喜欢,而Atom木有!! 记住上一次打开的目录 这个功能,截止目前最新的0.198版本还木有实现,这里我们用插件来实现这个功能; 但是官方说,"记住上一次打开的目录"这个功能已经内置到下一个版本(集成插件),也就是正式版1.0 插件的作者也声明了,看此段话: The Atom.io team is hopefully building a v

Asp.net实现直接在浏览器预览Word、Excel、PDF、Txt文件(附源码)

http://www.cnblogs.com/gossip/p/3473024.html Asp.net实现直接在浏览器预览Word.Excel.PDF.Txt文件(附源码) 功能说明 输入文件路径,在浏览器输出文件预览信息,经测试360极速(Chrome).IE9/10.Firefox通过 分类文件及代码说明  DemoFiles 存放可测试文件 Default.aspx  启动页 ExcelPreview.cs  Excel预览类 public static void Priview(Sys

Sublime text如何设置快捷键让编写的HTML文件在浏览器预览?

STEP 1 Tools->Build System->New Build System STEP 2<img src="https://pic3.zhimg.com/37243c718bd49b496f83ed8e61a4f876_b.jpg" data-rawwidth="798" data-rawheight="537" class="origin_image zh-lightbox-thumb" wi

Sublime text3配置LiveReload 浏览器即时刷新

1.在sublime控件台 install livereload插件(缺点:每次重新打开Sublime都需要启动) 2.配置Preference > Package Settings > LiveReload > Settings User { "enabled_plugins": [ "SimpleReloadPlugin", "SimpleRefresh" ] } 3.每次重新打开Sublime都需要启动,启动方法:Ctrl

在sublime-text中设置浏览器预览

配置在Chrome,Firefox中打开 安装 SideBarEnhancements 然后通过ctrl + k, ctrl + b打开侧边栏,在侧边栏的文件中右击,找到 open width -> edit applications 然后在这里边设置firefox打开的方式. application : 路径要修改为自己默认安装的路径. [    {"id": "side-bar-files-open-with",        "children