二、用Package Control 安装其他插件 按下Cmd+Shift+P 调出命令面板,输入install并调出Install Package选项并回车,然后在列表中选中要安装的插件。...三、推荐插件 1.Emmet 概括的说,Emmet(其前身是Zen Coding) 是一个可以让你更快更高效地编写HTML/CSS,可以节省你大量时间的插件。 调用Emmet快捷键:⌃⌥↩。...2.Git 这个插件会将git整合进你的SublimeText,使的你可以在SublimeText中运行Git命令,包括添加,提交文件,查看日志,文件注解以及其它Git功能。...窗口 ⌘N 新建文件 ⌘⇧W 关闭sublime,关闭所有文件 ⌘W 关闭当前文件 ⌘P 跳转、前往文件、前往项目、命令提示、前往method等等(Goto anything) ⌘⇧T 重新打开最近关闭的文件...在所有打开的文件中进行查找 拆分窗口/标签页 快捷键 功能 ⌘⌥[1,2,3,4] 单列、双列、三列、四列 ⌘⌥5 网格(4组) ⌃[1,2,3,4] 焦点移动到相应的组(分屏编号) ⌃⇧[1,2,3,4
自带了 JavaScript、TypeScript 和 Node.js 的支持。也就是说,你在书写 JS 和 TS 时,是自带智能提示的。当然其他的语言,你可以安装相应的扩展包插件,也会有智能提示。...,在命令面板中输入“快捷键”,可以进入快捷键的设置.或者你也可以选择菜单栏「偏好设置 --> 键盘快捷方式」进入快捷键的设置。...自动保存 方式1.在改完代码后,默认不会自动保存,此时你可以在设置项里搜索 files.autoSave , 将配置项修改为 onFocusChange 之后,那么当光标离开该文件后,这个文件就会自动保存了非常方便...3.如果我们想使用别人的配置,首先需要对方提供给你 gist:使用快捷键「Command + Shift + P」,在弹出的命令框中输入 sync,并选择「下载配置」,在弹出的界面中,选择「Download...:语法高亮,智能提示,emmet,错误提示,格式化,自动补全,debugger。
遗憾就是,对webpack项目中的路径别名无法识别 【全局】 npm Intellisense 在import语句中,自动填充npm模块。...(此插件主要用于AI开发,因此支持Node,安装之后,在Js代码书写中会给出代码提示。...": 8, // 打开的编辑器的最大数量(默认为10,超出数量会自动关闭) // 代码提示显示位置,控制自定义代码片段所处位置。..."emmet.triggerExpansionOnTab": true, "emmet.showSuggestionsAsSnippets": true, // 是否将自定义的代码片段作为提示建议显示...react 的jsx中添加对emmet的支持 }, // ===================格式化文件================ // 粘贴后的内容, 是否自动格式化 "editor.formatOnPaste
二、支持Vue文件的基本语法高亮 在VSCode Marketplace 搜素Vue 出现关于语法高亮的插件有 vue,vue-beautify,vue-color,VueHelper,vertur等等...安装ESLint可以有效的提示代码的低级错误,初期可能有些不习惯,但是使用时间长了会是很要的帮手。...HTML标签 Auto Rename Tag 修改HTML标签时,自动修改匹配的标签 Bookmarks添加行书签 Can I Use HTML5、CSS3、SVG的浏览器兼容性检查 Code...Node模块 npm运行npm命令 npm Intellisense 导入模块时,提示已安装模块名称 Output Colorizer彩色输出信息 Partial Diff 对比两段代码或文件...Ctrl + Shift + ` 新建命令提示符窗口 Ctrl + Shift + C 复制所选内容 Ctrl + Shift + V 粘贴所选内容 Ctrl + Up 向上滚动 Ctrl
说说你对margin的传递和折叠的理解 margin的传递一般是父子块元素之间,有margin-top传递,margin-bottom传递. margin-top传递: 当块级元素的顶部线和父元素的顶部线重叠...单元格合并 在某些特殊的情况下, 每个单元格占据的大小可能并不是固定的 一个单元格可能会跨多行或者多列来使用; 这个时候我们就要使用单元格合并来完成; 如何使用单元格合并呢?...单元格合并分成两种情况: 跨列合并: 使用colspan ✓ 在最左边的单元格写上colspan属性, 并且省略掉合并的td; 跨行合并: 使用rowspan ✓ 在最上面的单元格协商rowspan属性...Emmet Emmet (前身为 Zen Coding) 是一个能大幅度提高前端开发效率的一个工具. 在前端开发的过程中,一大部分的工作是写 HTML、CSS 代码, 如果手动来编写效果会非常低....VsCode内置了 Emmet语法 ,在后缀为.html/.css中输入缩写后按 Tab/Enter键即会自动生成相应代码 > (子代)和 + (兄弟) * (多个)和 ^ (上一级) ()(分组
要修改 locale.json,你可以同时按下 Ctrl+Shift+P 打开命令面板,之后输入 “config” 筛选可用命令列表,最后选择配置语言命令。 可以将编译器汉化。...7.HTML CSS Support 在编写样式表的时候,自动补全功能大大缩减了编写时间。 8.JavaScript (ES6) code snippets 支持ES6语法提示。...9.Mithril Emmet Emmet (前身为 Zen Coding) 是一个能大幅度提高前端开发效率的一个工具. 在前端开发的过程中,一大部分的工作是写 HTML、CSS 代码。...VsCode内置了Emmet语法,在后缀为.html/.css中输入缩写后按Tab键即会自动生成相应代码. 10.Path Intellisense 路径提示插件。...13.VueHelper vscode最好的vue代码提示插件,不仅包括了vue2所有api,还含有vue-router2和vuex2的代码提示.
js以及jquery等插件安装 ctrl+shif+p掉出命令框,输入pci ,选择install package 过一会会弹出对话框 输入:Emmet,选择安装,可以自动提示html css代码。...输入theme-选择合适主题 输入js选择snippets 输入jquery选择jquery自动提示 Emmet使用 ctrl+n创建一个新文件,然后ctrl+shif+p掉出命令窗口,输入ssjs,即...Ctrl+G 打开搜索框,自动带:,输入数字跳转到该行代码。举个栗子:在页面代码比较长的文件中快速定位。 Ctrl+R 打开搜索框,自动带@,输入关键字,查找文件中的函数名。...举个栗子:在函数较多的页面快速查找某个函数。 Ctrl+Shift+P 打开命令框。场景栗子:打开命名框,输入关键字,调用sublime text或插件的功能,例如使用package安装插件。...Alt+Shift+1 窗口分屏,恢复默认1屏(非小键盘的数字) Alt+Shift+2 左右分屏-2列 Alt+Shift+3 左右分屏-3列 Alt+Shift+4 左右分屏-4列 Alt+Shift
笔者推荐你作为自动化测试开发的首选IDE - by 苦叶子 Mac 键盘符号说明 图标 Mac键盘 ⌘ Command ⇧ Shift ⇪ Caps Lock ⌥ Option ⌃ Control ↩...⌘I 选择当前行 ⇧⌘L 选择当前选择的所有事件 ⌘F2 选择当前单词的所有出现 ⌃⇧⌘→ 展开选择 ⌃⇧⌘← 收缩选择 Shift+Alt+drag mouse(拖动鼠标) 列(框)选择 ⇧⌥⌘↑...语言编辑 Mac 快捷键 说明 ⌃Space 触发建议 ⇧⌘Space 触发参数提示 Tab Emmet扩展缩写 ⇧⌥F 格式化文档 ⌘K ⌘F 格式选择 F12 转到定义 ⌥F12 Peek定义...⌘K 输入保持打开 ⌃Tab / ⌃⇧ 选项卡打开下一个/上一个 ⌘K P 复制活动文件的路径 ⌘K R 在资源管理器中显示活动文件 ⌘K O 在新窗口/实例中显示活动文件 显示 Mac 快捷键...⇧⌘J 切换搜索详细信息 ⇧⌘C 打开新命令提示符/终端 ⇧⌘U 显示输出面板 ⇧⌘V 切换Markdown预览 ⌘K V 打开Markdown预览到一边 调试 Mac 快捷键 说明 F9 切换断点
Display Language命令然后按Enter键,将locale.json创建一个文件,其默认值设置为您的操作系统语言。...2.HTML Snippets:超级实用且初级的 H5代码片段以及提示; 3.HTMLHint:html代码检测; 4.HTML CSS Support :让 html 标签上写class 智能提示当前项目所支持的样式...; 11.Class autocomplete for HTML:编写html代码的朋友们对html代码的一大体现就是重复,如果纯用手敲不仅累还会影响项目进度,这款自动补全插件真的很棒; 12.beautify...21.vscode-fileheader:顶部注释模板,可定义作者、时间等信息,并会自动更新最后修改时间 22.Document This :js 的注释模板 (注意:新版的vscode已经原生支持,在....GitLens:丰富的git日志插件; 26.vetur:vue语法高亮、智能感知、Emmet等; 27.VueHelper:vue代码提示.
打开命令行 使用快捷键 ctrl+` 或者在菜单中点击 View > Show Console 。 2....安装 Emmet 在 Sublime Text 中按 Ctrl+Shift+p 快捷键或在菜单-工具中打开“命令面板”( Tools > Command Palette... ),输入:Install...Package (安装扩展)后回车,弹出新的窗口,再输入 Emmet 查找 Emmet 确定安装,等到自动打开一个文档,说明安装成功。...解决 Emmet 安装之后,Pyv8 未安装的问题 安装 Emmet 之后,自动打开的文档提示会自动安装 PyV8 的包,请在安装 PyV8 成功之后重启 Sublime Text ,你可能会发现 Sublime...Text 左下角一直显示 Loading PyV8… 之类的提示,如果关闭重启之后依旧如此,最后还是无法使用 Emmet 的话,就说明网络有一定的问题,无法正常下载 PyV8 的包了,下面介绍本地安装
服务程序(web应用程序) 六、nodejs安装配置 官网下载 自动安装 校验是否安装成功: node -v 环境变量会自动配置,如果现实不是内部命令或者外部命令,则配置环境变量 环境变量的意义,...,然后在列表中选中要安装的插件。...Emmet(原名 Zen Coding) 一种快速编写html/css的方法 注意:安装Emmet的同时,也会自动安装其依赖PyV8 binary库,安装PyV8库会用较长时间,可以在Sublime左下角看到安装进程状态...2. html5 支持hmtl5规范的插件包 注意:与Emmet插件配合使用,效果更好 使用方法:新建html文档>输入html5>敲击Tab键>自动补全html5规范文档 3. jQuery...,是少数支持sublime text 3的后缀提示的插件,HTML5标签提示sublime text 3自带,不过JQuery提示还是很有用处的,也可设置要提示的语言。
⌘I 选择当前行 ⇧⌘L 选择当前选择的所有事件 ⌘F2 选择当前单词的所有出现 ⌃⇧⌘→ 展开选择 ⌃⇧⌘← 收缩选择 Shift+Alt + drag mouse(拖动鼠标) 列(框)选择 ⇧⌥⌘...↑ 向上列(框)选择 ⇧⌥⌘↓ 向下列(框)选择 ⇧⌥⌘← 向左列(框)选择 ⇧⌥⌘→ 向右列(框)选择 ⇧⌥⌘PgUp 列(框)选择 向上一页 ⇧⌥⌘PgDown 列(框)选择 向下一页 搜索和替换...丰富的语言编辑 Mac 快捷键 介绍 ⌃Space 触发建议 ⇧⌘Space 触发参数提示 Tab Emmet扩展缩写 ⇧⌥F 格式化文档 ⌘K ⌘F 格式选择 F12 转到定义 ⌥F12 Peek...⌘K 输入保持打开 ⌃Tab / ⌃⇧ 选项卡打开下一个/上一个 ⌘K P 复制活动文件的路径 ⌘K R 在资源管理器中显示活动文件 ⌘K O 在新窗口/实例中显示活动文件 显示 Mac 快捷键 介绍...⇧⌘J 切换搜索详细信息 ⇧⌘C 打开新命令提示符/终端 ⇧⌘U 显示输出面板 ⇧⌘V 切换Markdown预览 ⌘K V 打开Markdown预览到一边 调试 Mac 快捷键 介绍 F9 切换断点
5.用Package Control安装插件的方法: 按下Ctrl+Shift+P调出命令面板 输入install 调出 Install Package 选项并回车,然后在列表中选中要安装的插件。...Emmet(原名 Zen Coding) 一种快速编写html/css的方法 注意:安装Emmet的同时,也会自动安装其依赖PyV8 binary库,安装PyV8库会用较长时间,可以在Sublime左下角看到安装进程状态...2. html5 支持hmtl5规范的插件包 注意:与Emmet插件配合使用,效果更好 使用方法:新建html文档>输入html5>敲击Tab键>自动补全html5规范文档 3. jQuery 支持JQuery...规范的插件包 4. javascript-API-Completions 支持Javascript、JQuery、Twitter Bootstrap框架、HTML5标签属性提示的插件,是少数支持sublime...text 3的后缀提示的插件,HTML5标签提示sublime text 3自带,不过JQuery提示还是很有用处的,也可设置要提示的语言。
,可以使用它们来生成ES6代码片段 6. npm Intellisense npm 装包后,require 时的包智能提示,import 语句中自动填充 npm 模块。...7.Vetur Vue 多功能集成插件,包括:语法高亮,智能提示,emmet,错误提示,格式化,自动补全,debugger。...,在安装界面往下拉有使用说明文档 14.Reactjs code snippets “emmet.includeLanguages”: { “javascript”: “javascriptreact...,会自动提示 "emmet.triggerExpansionOnTab": true, "emmet.showAbbreviationSuggestions": true,..."emmet.includeLanguages": { // jsx的提示 "javascript": "javascriptreact", "vue-html
大家好,又见面了,我是你们的朋友全栈君。...Mac os下 VSCode 快捷键 文章转载出处:http://www.cnblogs.com/informatics/ 全局 Command + Shift + P / F1 显示命令面板 Command...D 向下选中相同内容 Command + K Command + D 移除前一个向下选中相同内容 进阶 Ctrl + Space 打开建议 Command + Shift + Space 参数提示...Tab Emmet插件缩写补全 Option + Shift + F 格式化 Command + K Command + F 格式化选中内容 F12 跳转到声明位置 Option + F12...Ctrl + Shift + 新建终端 Command + Up 向上滚动 Command + Down 向下滚动 PgUp 向上翻页 PgDown 向下翻页 Command + Home 滚动到顶部
他可以输入命令行: 可以分屏幕; 代码补全和提示;还有各种插件和快捷方式。 好了,废话不多说,来看看它的庐山真面目吧。 ? 左边的第一个就是文档区,各种打开的项目,文档可以通过第一个来查看。...切换项目 Project Manager 项目管理,让我们方便的在命令面板中切换项目文件夹....识别 "xml": { "attr_quotes": "single" } }, // 在react的jsx中添加对emmet的支持 "emmet.includeLanguages...比如我如果开发网页多一点,就可以在插件市场里搜关于htm, css的插件。 HTML Snippets HTML CSS Support 这样它就自动提示html和CSS, 错了也能帮你指出来。...:Ctrl + D 回退上一个光标操作:Ctrl + U 7、关于 主命令框 的操作 打开命令面板:ctrl + shift + p 在打开的输入框内,可以输入任何命令。
在上/下插入光标 Insert cursor above / below Ctrl + U 撤消上一个光标操作 Undo last cursor operation Shift + Alt + I 在选定的每一行的末尾插入光标...+ PgUp / PgDown 列(框)选择页上/下 Column (box) selection page up/down 丰富的语言编辑 Rich languages editing 按 Press...Emmet 展开缩写 Emmet expand abbreviation Shift + Alt + F 格式化文档 Format document Ctrl + K Ctrl + F 格式选定区域...Extensions Ctrl+Shift+H 替换文件 Replace in files Ctrl+Shift+J 切换搜索详细信息 Toggle Search details Ctrl+Shift+C 打开新命令提示符...Ctrl+↑ / ↓ 向上/向下滚动 Scroll up/down Shift+PgUp / PgDown 向上/向下滚动页面 Scroll page up/down Ctrl+Home / End 滚动到顶部
不能理解,node 6.x为什么不支持import Instant Markdown 编辑Markdown文档,同时在浏览器预览 ?...HTML CSS Support 让 html 标签上写class 智能提示当前项目所支持的样式 ?...Path Intellisense 自动补全路劲 Npm Intellisense require 时的包提示 HTMLHint html代码检测 Atuo Rename Tag...修改 html 标签,自动帮你完成尾部闭合标签的同步修改。...fileheader 顶部注释模板,可定义作者、时间等信息,并会自动更新最后修改时间 vetur 语法高亮、智能感知、Emmet等 VueHelper snippet代码片段 参考
Path Intellisense 自动路劲补全,默认不带这个功能的,赶紧装 Npm Intellisense require 时的包提示(最新版的vscode已经集成此功能) Document...this js 的注释模板 (注意:新版的vscode已经原生支持,在function上输入/** tab) ESlint ESlint 接管原生 js 提示,可以自定制提示规则。...常用 bootstrap 的可以下 Atuo Rename Tag 修改 html 标签,自动帮你完成尾部闭合标签的同步修改。...GitLens 丰富的git日志插件 fileheader 顶部注释模板,可定义作者、时间等信息,并会自动更新最后修改时间 filesize 在底部状态栏显示当前文件大小,点击后还可以看到详细创建...Vue插件 vetur 语法高亮、智能感知、Emmet等 VueHelper snippet代码片段 Dracula 目前我觉得是vscode上最漂亮的主题,vscode 1.11+允许自定义statusBar
Ctrl+Shift+A 选择光标位置父标签对儿 Ctrl+Shift+D 复制光标所在整行,插入在该行之前 ctrl+shift+F 在文件夹内查找,与普通编辑器不同的地方是sublime允许添加多个文件夹进行查找...常用插件 【emmet】 高效编写HTML和CSS https://github.com/sergeche/emmet-sublime emmet 快捷键 (1) 生成html5的结构代码...Sublime-HTMLPrettify 【CSScomb】 CSS整理 http://csscomb.com/ 【sublimeCodeintel】 shift + ctrl + space 代码自动提示...https://packagecontrol.io/packages/SublimeCodeIntel 【All Autocomplete】 搜索所有打开的文件来寻找匹配的提示词 【AutoFileName...】 自动搜索提示相关的文件路径,如 js、css、img 等 【BracketHighlighter】 高亮选中的括号,支持代码折叠 【Color Highlighter】 色彩高亮 【FileHeader
领取专属 10元无门槛券
手把手带您无忧上云