It comes with built-in support for JavaScript, TypeScript and Node.js and has a rich ecosystem of extensions...英文官网：https://code.visualstudio.com/ 中文官网：http://www.vscode.org/ 一、下载并安装VSCode 点击下载： VSCode，并且安装到本地...可以使用 npm install -g eslint-plugin-html 来安装 接着，安装了 HTML 插件后，还需要在 vscode 中配置下 ESLint： "eslint.validate...Ctrl + Shift + ] 展开代码块 Ctrl + K Ctrl + [ 折叠全部子代码块 Ctrl + K Ctrl + ] 展开全部子代码块 Ctrl + K Ctrl + 0 折叠全部代码块...editor.action.addSelectionToNextFindMatch", "when": "editorFocus" }, // ctrl+shift+/多行注释
1表示启用某个功能，设成0表示不启用某个功能。...minimize.to.tray=0 #scite启动时tab栏可见 tabbar.visible=1 #当只打开一篇文档时隐藏tab栏 tabbar.hide.one=0 #tab栏启用多行模式，同时打开较多文件时...，多行模式比较方便 tabbar.multiline=1 #打开文件路径为当前编辑文件相同目录 open.dialog.in.file.directory=1 #将结果输出窗口放到下方 split.vertical...，建议打开 fold=1 #折叠指示，建议打开 fold.compact=1 #折叠代码样式1\2\3，2比较好看 fold.symbols=3 #代码折叠区的宽度 fold.margin.width=...，把自己最常编辑的文件类型写到source.files中，如*.php;*.html;等++++++++++++++++++++++++++++ source.files=*.asm;*.c;*.cc;
自动提示路径 : vscode 的其他用法 隐藏右边迷你预览图 => 查看 => 切换小视图 侧边栏左右切换 : =>查看 => 向右切换侧边栏 打开文件夹 : => 文件 => 打开文件夹 资源管理器中...单行注释 : // 这是单行注释， 单行注释只能写一行代码 // 快捷键： ctrl + / 多行注释 : /* 这是多行注释，在多行注释中可以 换行 sublime Text : 快捷键 ctrl...+ shift + / vscode : 选中多行直接注释,即可,但是这种多行注释 如果需要得自己手写 /* 在写代码的时候，需要写注释，这是一个良好的习惯, 大家初学,一定多写注释 !...= 12; var num2 = '12'; 可以通过颜色 字符串长度 每一个字符串都有一个length属性，可以获取到字符串中字符串的个数 var str = "akdjflksjdflk"; console.log...a); NaN NaN: not a number, 表示一个非数字 在js中，NaN用来表示一个非数字的特殊值，当发现无法进行运算时，js不会报错，而是会返回一个NaN NaN的注意事项： NaN的类型是
Alpha和正式版共用相同的用户配置，如主题、快捷键设置、代码块设置。但插件需要各自安装。Alpha和正式版能同时启动一个。先开启正式版，再启动Alpha版会激活已经开启的正式版。反之亦然。...不像IDE一样能够直接在浏览器中打开html，而该插件支持快捷键与鼠标右键快速在浏览器中打开html文件，支持自定义打开指定的浏览器，包括：Firefox，Chrome，Opera，IE以及Safari...Command + Shift + D 复制光标所在整行，插入在该行之前 Command + K U 选中单词改为大写 Command + K L 选中单词改为小写 Command + Option + [ 代码折叠...） 或 将多行内容合并成一行（已选择需要合并的多行时） Option + Shift +↑ 向上复制一行 Option + Shift + ↓ 向下复制一行 Option + → 以单词为单位向后移动光标...Command + Shift + U 显示、隐藏输出面板 集成终端 Control + 显示终端 Control + Shift + 新建终端 Command + Shift + U 输出 Command
前言 VSCode的快捷键继承了一些IDE风格，有VS的身影，也有Emacs的身影。。简言之，内置快捷键玩熟了，效率提高不是一点两点。...---- VsCode 快捷键有五种组合方式（科普） Ctrl + Shift + ?...Ctrl + Shift + ] 展开区域代码 Ctrl + K Ctrl + [ 折叠所有子区域代码 Ctrl + k Ctrl + ] 展开所有折叠的子区域代码 Ctrl + K Ctrl + 0...折叠所有区域代码 Ctrl + K Ctrl + J 展开所有折叠区域代码 Ctrl + K Ctrl + C 添加行注释 Ctrl + K Ctrl + U 删除行注释 Ctrl + / 添加关闭行注释...---- 显示 快捷键 作用 F11 切换全屏模式 Shift + Alt + 1 切换编辑布局【目前无效】 Ctrl + =/- 放大 / 缩小 Ctrl + B 侧边栏显示隐藏 Ctrl + Shift
启用-w选项时，此类解释会产生警告： irb(main):013:0> puts '你好 \n Ruby', "前面好多空格" 你好 \n Ruby 前面好多空格 => nil 长字符串... Ruby也可以多行构建字符串。..."这是主线程Ruby3程序" END { puts "Ruby3程序结束" } BEGIN { puts "Ruby3程序开始" } 代码注释 注释可以在Ruby解释器中隐藏一行...(main):070:0> name = "v3u.cn" # 这又是一个注释 => "v3u.cn" irb(main):071:0> 也可以通过使用=begin/=end从Ruby3解释器中隐藏了多行代码...=end 编辑器（Vscode） 如果厌倦了在irb命令行中编写Ruby代码，我们也可以在编辑器中随心所欲地编写，这里推荐微软开源的Vscode编辑器，下载地址：https://code.visualstudio.com
使用VSCode的快捷键，效率会提高很多 VsCode快捷键五种组合方式 组合 解释 Ctrl + Shift + ?...Ctrl + Shift + ] 展开区域代码 Ctrl + K Ctrl + [ 折叠所有子区域代码 Ctrl + k Ctrl + ] 展开所有折叠的子区域代码 Ctrl + K Ctrl + 0...折叠所有区域代码 Ctrl + K Ctrl + J 展开所有折叠区域代码 Ctrl + K Ctrl + C 添加行注释 Ctrl + K Ctrl + U 删除行注释 Ctrl + / 添加关闭行注释...M 进入用Tab来移动焦点 查询与替换 快捷键 作用 Ctrl + F 查询 Ctrl + H 替换 F3 / Shift + F3 查询下一个/上一个 Alt + Enter 选中所有出现在查询中的...显示 快捷键 作用 F11 切换全屏模式 Shift + Alt + 1 切换编辑布局 Ctrl + =/- 放大 / 缩小 Ctrl + B 侧边栏显示隐藏 Ctrl + Shift + E 资源视图和编辑视图的焦点切换
插件-折叠插件(Collapse) 1、基本折叠效果 1、触发器元素 1、a 元素充当触发器 属性：...屏幕尺寸>=768时，正常显示 屏幕尺寸<=767时，隐藏,需要通过触发器展开 4、JS插件-图片轮播(Carousel) 1、...静态语言的确定：可维护性差 2、动态样式语言 如：Less，Stylus，Sass/Scss ......Less中是完全兼容和支持CSS的 在Web网页中使用Less的两种方式： 1、在客户端浏览器中编译Less - 不推荐 2、在服务器端编译Less - 推荐...多行注释：/* */ 单行注释：// 注意：只有多行注释会被编译到 css 中 3、Less 中支持 变量(Variable)
今天周男神上完课了，分享了他的Code 打开VSCode的时候发现更新了，先看看更新内容 https://code.visualstudio.com/updates/v1_59 关于更多相关资料，可以看...对笔记本布局进行了一些改进： 当单元格折叠时，单元格输入的第一行现在被渲染。 当窗口的宽度不足以呈现所有主要操作时，笔记本编辑器工具栏上的操作将移动到溢出菜单 ( ... ) 中。...但是，当你启用此设置时，除非为编辑器组找到更具体的视图状态，否则将在所有编辑器组中保留并使用最新的编辑器视图状态。...) 转到父折叠( editor.gotoParentFold) 这个是让导入的语句可以自动的折叠 该功能适用于 TypeScript、JavaScript、Java、C#、C++ 还有一个如字面意思的设置...此功能使用开源 ML 库Tensorflow.js和GitHub 用户@yoeo来自Guesslang的 ML 模型。 在此版本中，此功能将默认关闭，但我们计划将其设为下一次迭代的默认设置。
Better Comments 美化注释，可以将我们的多行注释按照类别自动高亮，如： Bracket Pair Colorizer 开发神器，当使用多层括号嵌套时，自动将不同层次的括号设置成不同的颜色...live server 前端神器，可以在 vscode 中预览编写的网页。...只需注意左侧的灯泡，然后按一下它即可了解如何在光标下转换代码。 json2ts 可将JSON转换为TypeScript接口。您可以从VS Code中浏览和安装扩展。...Browser Preview,在vscode中实现预览调试 Settings Sync 上传和拉取 vscode 可以快速完成配置，自动安装相关扩展 搜索扩展并安装Settings Sync 拉取公共配置文件和扩展...搜索并安装这两个插件：ESlint Prettier 安装完成之后，按下ctrl+shit+p，输入setting.json，选择首选项：打开设置（json）回车 在设置中插入如下配置 JS // eslint
如何在 VSCode 中通过插件来协助代码校验工作； 如何保证 push 到远程仓库的代码是符合规范的； 下面开始阅读吧，如果你对 ESLint 比较熟悉，可以直接跳过这个部分。...规则的校验说明，有 3 个报错等级 off 或 0：关闭对该规则的校验； warn 或 1：启用规则，不满足时抛出警告，且不会退出编译进程； error 或 2：启用规则，不满足时抛出错误，且会退出编译进程...下面将细说如何在 Vue 中落地代码校验。...可以直接在 IDE 里安装 ESLint 插件，因为我使用的是 VSCode，所以这里只介绍在 VSCode 中的配置。...“注意：mrm 是一个自动化工具，它将根据 package.json 依赖项中的代码质量工具来安装和配置 husky 和 lint-staged，因此请确保在此之前安装并配置所有代码质量工具，如 Prettier
command + right // 光标移到行尾 command + ] // 缩进 command + [ // 减少缩进 command + x // 剪切本行 command + b // 显示/隐藏侧边栏...+ d 的全选操作 shift + command + f // 全局搜索 shift + ctrl + ] // 移动到后半个括号 command + options + down/up // 多行多列编辑...ctrl + g // 跳转到 n 行 command + k => + l // 先 command + k 完事之后再按 l，打开vscode快捷键文档 二、vscode 断点调试nodejs...vscode可以直接运行js代码，还可以断点，但是需要在编辑器里面使用 debug 模式启动。...当然，这会耗费我们一些时间，复杂的请求使用第三方工具（如：postman）会更方便。 除了使用第三方工具，其实 vscode 的一个插件也可以做到，这就是 REST Client。
编辑体验：跳转到定义、智能提示、自动补全、查找引用、变量重命名等等 这些统统没有，都是由插件提供的，对JS的支持也是这样 一.内置插件 VS Code内置插件中，与JavaScript有关的只有一个vscode.../src ├── commands.ts # TS相关自定义command ├── extension.ts # 插件入口 ├── features # 各种语言特性，如高亮、折叠、跳转到定义等...，为高亮、折叠、跳转等Editor功能入口提供具体实现 Server：接入TSServer，以获得理解JS代码语义的能力，为语义相关的功能提供数据源 Client：与Server交互（按照既定接口协议）...也就是说，VSCode的宇宙级JS编辑体验，都得益于下层的TypeScript： One of TypeScript’s goals is to deliver a state-of-the-art editing...砰，就跳过去了 P.S.VSCode中其它JS语义相关的功能与之类似，都依靠TSServer提供支持 参考资料 Microsoft/vscode 1.28.2 Architectural Overview
合并多行 ?...或者，你可以在设置中启用空白剪除（white-space trimming）。 1 打开VS用户设置（偏好>设置>用户设置选项卡） 2 点击窗口右上方的{}图标。...代码折叠 有时，如果文件很大，而你只是想大概浏览代码，则需要代码折叠。 ?...选定字符串 ?...结论 由于有许多快捷键可以满足你的需求，因此，我为其他操作系统中的所有vscode快捷键添加了指向PDF的链接。
前言 VSCode的快捷键继承了一些IDE风格，有VS Studio的身影，也有Emacs的身影, 简言之，内置快捷键玩熟了，效率提高不是一点两点。...Ctrl + Shift + ] 展开区域代码 Ctrl + K Ctrl + [ 折叠所有子区域代码 Ctrl + k Ctrl + ] 展开所有折叠的子区域代码 Ctrl + K Ctrl + 0...折叠所有区域代码 Ctrl + K Ctrl + J 展开所有折叠区域代码 Ctrl + K Ctrl + C 添加行注释 Ctrl + K Ctrl + U 删除行注释 Ctrl + / 添加关闭行注释...M 进入用Tab来移动焦点 查询与替换 快捷键 作用 Ctrl + F 查询 Ctrl + H 替换 F3 / Shift + F3 查询下一个/上一个 Alt + Enter 选中所有出现在查询中的...显示 快捷键 作用 F11 切换全屏模式 Shift + Alt + 1 切换编辑布局【目前无效】 Ctrl + =/- 放大 / 缩小 Ctrl + B 侧边栏显示隐藏 Ctrl + Shift
Intellisense 自动完成文件名的 Visual Studio 代码插件 [iaHeUiDeTUZuo] React-Native/React/Redux snippets for es6/es7 在 JS...安装 "JavaScript 标准样式" 扩展 如果您不知道如何在 `Visual Studio` 中安装扩展，请查看文档。 您将需要重新加载 `Visual Studio` 才能使用新的扩展。...wxml 微信 wxml 支持 /vscode 片段 vscode-fileheader 插入标题注释，并自动更新时间。...以下设置为包括 ESLint 在内的所有提供程序都启用了自动修复： "editor.codeActionsOnSave": { "source.fixAll": true } 相反，此配置仅在...CSS Peek 允许查看 CSS ID 和类字符串作为从 HTML 文件到相应 CSS 的定义。允许查看和转到定义。
{ // 分号 "prettier.semi": false, "prettier.eslintIntegration": true, // 单引号包裹字符串 // 尽可能控制尾随逗号的打印...false, // 让函数(名)和后面的括号之间加个空格 "javascript.format.insertSpaceBeforeFunctionParenthesis": true, // 启用..."vetur.format.defaultFormatter.html": "js-beautify-html", // 让vue中的js按编辑器自带的ts格式进行格式化 "vetur.format.defaultFormatter.js...": "vscode-typescript", "vetur.format.defaultFormatterOptions": { "js-beautify-html": { "...自带的自动保存 ，vscode 默认也是 false "editor.formatOnSave": false, // vscode默认启用了根据文件类型自动设置tabsize的选项 "editor.detectIndentation
ctrl + Enter 跳转下一行开头 shift + ctrl + enter 跳转上一行开头 Ctrl+Shift+ 跳转到相应的匹配括号 ctrl+shift+[ 折叠 html快速加注释 ctrl...Shift+End 选择从行首到光标处： Shift+Home 删除光标右侧的所有字： Ctrl+Delete 扩展/缩小选取范围： Shift+Alt+Left 和 Shift+Alt+Right 多行编辑...(列编辑)：Alt+Shift+鼠标左键，Ctrl+Alt+Down/Up 同时选中所有匹配： Ctrl+Shift+L Ctrl+D 下一个匹配的也被选中 (在 sublime 中是删除当前行，后面自定义快键键中...editor.action.addSelectionToNextFindMatch", "when": "editorFocus" }, // ctrl+shift+/多行注释...支持HTML5的标签提示 4）HTML CSS support css自动补齐 5）JS-CSS-HTML Formatter 格式化 6）jQuery Code Snippets jquery
插件名：Tabnine 功能：智能提示代码，可以预测你将要写的代码进行提示 Template String Converter 插件名：Template String Converter 功能：在字符串中输入...$触发，将字符串转换为模板字符串 vscode-pigments 插件名：vscode-pigments 功能：实时预览设置的颜色 Parameter Hints 插件名：Parameter...插件名：vscode-styled-components 功能：在JS文件中写样式时，有智能提示 主题类 vscode-icons 插件名：vscode-icons VSCode文件夹...属性时 画板作图 插件名：Draw.io Integration 功能：在VSCode中画图，支持多人协作编辑图表… Echars 智能提示插件 插件名：echarts-vscode-extension...支持不同语言，单行、多行注释、 支持用户字符串与变量翻译,支持驼峰拆分 总结（附全部插件图片） 根据需求，大家安装对应插件即可（安装太多插件，VSCode会很卡） 当然电脑配置足够强大，当我没说
技巧2-在输出中显示多个项目 Jupyter笔记本一次只显示一个输出，如下所示。在本例中，只显示最后一个变量的输出。 ? 我们可以在下面添加此代码以显示单元格中的所有输出。...技巧7-使用多行光标 假设您有多行代码，如下所示，并且希望删除每行代码中的所有数字。不要逐行删除每个数字，你可以一次全部删除！ ? 按住Alt键并选择整个单元格内容。...下面是您可以启用的可配置扩展的列表。对我来说，一些有用的是可折叠标题、代码折叠、草稿行和拼写检查器。...技巧13-隐藏输出以加快速度 有时候会遇到显示速度很慢的问题，这可能是因为有很多图形正在呈现。 将鼠标悬停在图表左侧的区域（请参见下面的红色矩形），然后双击该区域以隐藏输出。这会大大加快速度！ ?...如果您创建这些不同的标题，并将其与技巧9中提到的可折叠标题扩展相结合，则隐藏大量单元格以及快速导航和移动各节将非常有用。
领取专属 10元无门槛券
手把手带您无忧上云
