前端知识库(lizh)
  • README
  • Bugs
    • 前端调试随笔
    • 浏览器常见问题概览
    • 浏览器兼容问题概览
    • HTML常见问题概览
    • CSS常见问题概览
    • JS常见问题概览
    • 移动端兼容性问题概览
    • 微信小程序开发
    • NodeJs常见问题概览
    • Mac常见问题概览
    • 微信开发遇坑指南
    • Npm包常见问题概览
    • 其他问题汇总
  • Css探索系列
    • CSS基础知识
    • CSS常见问答
    • CSS常见问答02
    • CSS应用示例
    • CSS应用示例02
    • 由Z Index引发的层叠上下文思考
    • 由浮动塌陷引发的块级格式上下文思考
    • CSS探索系列 Flex布局
    • CSS探索系列 Margin
    • CSS探索系列 Auto关键字
    • CSS探索系列 Gradient
    • CSS探索系列 Line Height
    • CSS探索系列 元素居中
    • CSS探索系列 动画
    • 为什么使用PostCSS处理CSS?
    • 重新认识伪类与伪元素
    • 自定义表单伪元素样式
    • 如何理解Css中的Display属性
    • 视口和软键盘对视口的影响
    • 关于Css
  • Frontend
    • 00 关于Web前端
    • 01 前端知识概览
    • 02 常用前端库概览
    • 基础 00 前端常见问题01
    • 基础 01 浏览器缓存
    • 基础 02 浏览器工作原理
    • 基础 03 谈谈前端跨源问题及解决方法
    • 进阶 01 Web性能优化
    • 进阶 02 搜索引擎优化(SEO)
    • 进阶 03 前端模块化编程
    • 进阶 04 规范代码:Linter、Prettier、EditorConfig
    • 进阶 11 前端自动化测试
    • 高级 01 前端安全
    • Vue2.X原理篇
    • Vue3初步了解及迁移指南
    • 重读Vue教程
    • React17.X原理篇
    • 你必须知道的React问题
    • 重读React教程
    • 聊一聊Cookie的一些问题
    • 如何理解HTTP响应的状态码
    • HTTP的历史演变及概述
    • Webpack4.X原理篇
    • Webpack基础入门篇
    • Webpack构建优化篇
    • TypeScript使用指南
    • 代码规范
      • 前端规范
      • HTML
      • CSS
      • JS
  • Html探索系列
    • HTML基础知识
    • HTML基础知识02
    • HTML常见问答
    • HTML经典实践用例
    • HTML元素的宽高及位置详解
    • Video元素的使用和常见问题总结
    • Html探索系列 Meta标签
    • DOCTYPE:文档类型与浏览器模式
    • DHTML(动态网页)简介
    • HTML标签详解
    • HTML布局的几种方式
    • HTML全局属性
    • 关于Html
  • Js探索系列
    • 基础知识
    • 常见问答
    • 应用示例
    • 趣味示例
    • 基础篇 05 AJAX
    • 基础篇 06 Window对象
    • 基础篇 07 Error、JSON、Math、Console对象
    • 基础篇 08 History、URL、Screen、Navigator、Location对象
    • 基础篇 09 文档对象模型(DOM)
    • 基础篇 10 Document对象
    • 基础篇 11 Element对象
    • 基础篇 12 Event对象
    • 基础篇 13 键盘、鼠标、触摸事件
    • 基础篇 15 CSS对象模型(CSSOM)
    • 进阶篇 01 Prototype对象和继承
    • 进阶篇 02 Promise对象
    • 进阶篇 07 迭代器(Iterator)
    • 进阶篇 08 Generator和Async函数
    • 进阶篇 09 JavaScript异步编程
    • Date对象和日期时间字符串格式
    • Canvas基础入门篇
    • Canvas进阶篇
    • SVG基础入门篇
    • 四种判断数据类型方法的优缺点
    • 深入理解JavaScript的浅拷贝和深拷贝
    • 谈谈JavaScript的作用域和上下文
    • 复制内容到剪贴板
    • 关于Javascript
  • NodeJs
    • 关于Node.Js
    • Node.Js:三种调试方法
    • Npm包管理器简介及一些机制
    • NPM:Package.Json详解(中文)
    • NPM:从零开始,开发一个软件包
    • NPM:常用命令
    • Node.Js:Fs(文件系统)
    • Node.Js:Global(全局变量)
    • Node.Js:HTTP
    • Node.Js:Module(模块)
    • Node.Js:Path(路径)
    • Node.Js:Readline(逐行读取)
  • Research
    • 极细边框(1px边框)实现方式
    • 如何监控前端异常?
    • H5页面跳转和刷新
    • Web主题切换和个性化定制方法总结
    • Vue SSR(服务端渲染)的简单实现
    • 基于Create React App打造代码规范化的React+Ts项目
    • H5可视化编辑
    • Web常用功能
    • Javascript加密混淆
    • Vue如何导入TypeScript
    • 移动端PDF预览
    • 纯CSS绘制箭头
    • 网站性能测量和优化方法
  • Tech
    • GOOGLE浏览器的搜索技巧
    • Curl的用法指南
    • Sublime3插件篇
    • Charles安装及使用
    • Nginx基础使用
    • 排序算法(Javascript)
    • 代码整洁之道(摘录笔记)
    • Java的24种设计模式与7大原则
    • 观察者和发布订阅模式
  • Tools
    • Git
      • Git基础教程
      • Git常见问题
    • Gitbook
      • Gitbook入门篇
      • Gitbook插件篇
      • Gitbook进阶篇
由 GitBook 提供支持
在本页
  • 插件管理工具
  • 错误安装(不可用)
  • 正确安装(可用)
  • 常用插件列表
  • Emmet(原名 Zen Coding)
  • html5
  • javascript-API-Completions
  • JSFormat
  • SublimeLinter
  • BracketHighlighter
  • Alignment
  • Ctags
  • DocBlockr
  • SideBarEnhancements
  • DocBlockr
  • FileHeader
  • 常见问题
  • 设置默认浏览器和快捷键

这有帮助吗?

  1. Tech

Sublime3插件篇

插件管理工具

错误安装(不可用)

按Ctrl + `(此符号为tab按键上面的按键) 调出console,粘贴以下代码到命令行并回车:

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 3已经不支持Package Control安装插件了!

正确安装(可用)

  1. 手动下载一个package control的包:https://github.com/wbond/package_control。

  2. 下载解压后,将解压文件重新命名为:Package Control ,拷贝到sublime 的packages目录下。可以直接菜单栏Perferences -->Browse Packages打开。

    严格按照上面明明,首字母记住要大些!!!

  3. 重启sublime,点击菜单栏Perferences,会发现多了Package Settings 和Package Control 这两个菜单,这就说明 Package Control安装成功了。

  4. 尝试下安装一个插件,如Emmet。Ctrl +Shift+P 打开控制台,输入install,选择Install Package。此时要等待一会,因为Package Control 正在加载插件列表。

  5. 但是很不幸,又失败了!控制台提示无法访问https://packagecontrol.io/channel_v3.json。这个应该也是被墙了...

  6. 不过,别慌!这是可以解决的。

    打开Package Settings-->Package Control --> Settings User,加入如下内容:

    "channels": [ "http://cst.stu.126.net/u/json/cms/channel_v3.json"]

    http://cst.stu.126.net/u/json/cms/channel_v3.json是个国内的战点

常用插件列表

用Package Control安装插件的方法:按下Ctrl+Shift+P调出命令面板,输入install 调出Install Package选项,然后在列表中选中要安装的插件。

注意:安装插件时保持网络畅通,避免插件由于网络原因奔溃

Emmet(原名 Zen Coding)

一种快速编写html/css的方法。

安装Emmet的同时,也会自动安装其依赖PyV8 binary库,安装PyV8库会用较长时间,可以在Sublime左下角看到安装进程状态。

html5

支持hmtl5规范的插件包。

使用方法:新建html文档 -> ! -> 敲击Tab键 -> 自动补全html5规范文档。

javascript-API-Completions

支持Javascript、JQuery、Twitter Bootstrap框架、HTML5标签属性提示的插件,是少数支持sublime text 3的后缀提示的插件,HTML5标签提示sublime text 3自带,不过JQuery提示还是很有用处的,也可设置要提示的语言。

JSFormat

JS代码格式化插件。

**使用方法:**使用快捷键ctrl+alt+f

SublimeLinter

一个支持lint语法的插件,可以高亮linter认为有错误的代码行,也支持高亮一些特别的注释,比如“TODO”,这样就可以被快速定位。(IntelliJ IDEA的TODO功能很赞,这个插件虽然比不上,但是也够用了吧)

BracketHighlighter

类似于代码匹配,可以匹配括号,引号等符号内的范围。

使用方法:系统默认为白色高亮,可以使用链接所述方法进行自定义配置

Alignment

代码对齐,如写几个变量,选中这几行,Ctrl+Alt+A,哇,齐了。

Ctags

函数跳转,我的电脑上是Alt+点击 函数名称,会跳转到相应的函数

DocBlockr

注释插件,生成幽美的注释。标准的注释,包括函数名、参数、返回值等,并以多行显示,省去手动编写。

SideBarEnhancements

侧栏右键功能增强,非常实用

支持对函数、变量的快捷注释

FileHeader

新建文件时,增加文件头注释

常见问题

设置默认浏览器和快捷键

  • 安装插件 SideBarEnhancements

  • 选择浏览器打开 html:在左侧栏中,右键 html 文件,单击右键菜单栏中 Open In Browser,选择浏览器

  • 设置默认浏览器和快捷键:preferences -> Package Settings -> Side Bar -> Setting User ,添加设置:

    [
    	{
    	    "keys":["f10"],
    		"command":"side_bar_files_open_with",
    		"args":{
    		"paths":[],
    			"application":"C:/Users/lizhao/AppData/Local/Google/Chrome/Application/chrome.exe",
    			"extensions":".*"
    		}
    	}
    ]
上一页Curl的用法指南下一页Charles安装及使用

最后更新于3年前

这有帮助吗?

官网插件库
DocBlockr