首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

提高你的编码效率

对于编辑器来说,要能设置漂亮的界面,能够代码提示和自动补全,能够支持各种语言和代码检查,能够方便快捷的操作。 感觉VScode就是集成了各种编辑器的优点。...一、代码补全 Auto Close Tag 适用于 JSX、Vue、HTML,能自动补全要闭合的标签 Auto Rename Tag 适用于 JSX、Vue、HTML,在修改标签名时,能在你修改开始(结束...)标签的时候修改对应的结束(开始)标签,帮你减少 50% 的击键 Document This 自动生成 JSDoc 注释,快捷键ctrl+alt+d ctrl+alt+d。...在你用任何方式引入文件系统中的路径时提供智能提示和自动完成 VueHelper Vue2代码段(包括Vue2 api、vue-router2、vuex2) HTML Snippets 各种 HTML 标签片段...Markdown All In One Markdown 格式化 TODO Highlight 这个插件能够在你的代码中标记出所有的 TODO 注释,以便更容易追踪任何未完成的业务。

1.7K10

用了这 7 个 VS Code 插件,想写一辈子代码

语法确实很简洁,可以使用许多选项来满足您的需求。一个简单的 GET 请求所需要的只是一行包含 GET 关键字和 URL 的代码。 再次极力推荐,你应该尝试一下 REST Client 插件。...CSS Peek 如果你是 web 开发人员,那么 CSS Peek 是绝对必要的。通过此插件,您只需将鼠标悬停在元素的类名或 ID 上,即可查看应用于 HTML 中某个元素的 CSS 规则。...该扩展程序下载量超过 500 万,在大多数已安装的插件中排名前 20 位。 4. Auto Rename Tag 自动重命名标签 插件的功能很简单,但是非常好。该插件自动重命名配对的 HTML 标记。...如果要重命名开始标签,它将更改相应的结束标签。反之亦然。...同时安装这两个扩展功能非常强大,可以帮助您以更高效,更一致的方式编写 HTML。 5. Quokka.js Quokka.js 是你编辑器中的原型实验场,可以生成文件报告,内联报告等。

85220
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    用了这 7 个 VS Code 插件,想写一辈子代码

    语法确实很简洁,可以使用许多选项来满足您的需求。一个简单的 GET 请求所需要的只是一行包含 GET 关键字和 URL 的代码。 再次极力推荐,你应该尝试一下 REST Client 插件。...CSS Peek 如果你是 web 开发人员,那么 CSS Peek 是绝对必要的。通过此插件,您只需将鼠标悬停在元素的类名或 ID 上,即可查看应用于 HTML 中某个元素的 CSS 规则。...该扩展程序下载量超过 500 万,在大多数已安装的插件中排名前 20 位。 4. Auto Rename Tag 自动重命名标签 插件的功能很简单,但是非常好。该插件自动重命名配对的 HTML 标记。...如果要重命名开始标签,它将更改相应的结束标签。反之亦然。 如果要在输入开始标签的右括号时自动添加结束标签,则应查看【?...同时安装这两个扩展功能非常强大,可以帮助您以更高效,更一致的方式编写 HTML。 5. Quokka.js Quokka.js 是你编辑器中的原型实验场,可以生成文件报告,内联报告等。

    1.1K30

    2023 最新最全 VSCode 插件推荐!

    Auto Rename Tag 使用该插件,可以在重命名一个 HTML 标签时,自动重命名 HTML 标签的开始和结束标签。避免只修改了开始标签,而忘记修改结束标签。...该扩展适用于 HTML、XML、PHP 和 JavaScript。 Auto Close Tag 通常想要使用一个特定的 HTML 元素时,需要输入开始标签和结束标签。...使用该插件后,只需要输入开始标签,它就会自动添加结束标签。对于 Vue 开发人员来说,它还支持自定义类型名称。当输入自定义组件的开始标签时,它会自动添加结束标签。...编程美化 Highlight Matching Tag 当有很多 HTML 标签时,有时很难将结束标签定位到对应的开始标签,反之亦然。使用该插件,单击开始标签时,会看到结束标签带有下划线。...此外,它还会突出显示代码树中的开始和结束标签。如果需要,可以自定义样式以使下划线更加突出。

    3K30

    博客生成静态站点工具 Top 20

    MkDocs 是一个简单易用的静态网站生成器,基于 Markdown 文档构建漂亮的 HTML 文档页面。 MkDocs具有以下特点: 采用Markdown格式编写文档,易于编写和维护。...部署简单,可以将生成的HTML静态页面部署到任何Web服务器上。 使用 MkDocs,您可以快速创建漂亮的文档页面,非常适合技术写作、软件文档、项目文档等。...Pelican 支持 Markdown、reStructuredText 等多种标记语言,并且可以根据自己的需要进行扩展。...Brunch 是一个快速、简单的静态站点生成器和构建工具,它可以处理多种前端语言和框架,例如 HTML、CSS、JavaScript、React、Vue 等。...Brunch 非常易于使用,只需要配置几个文件即可开始构建站点。Brunch 也提供了一些插件和工具,例如压缩、部署和热更新等。

    3.8K21

    这几个库颠覆你对数据交互的想象

    前言 作为一个对UI和动画敏感的切图仔,在日常开发之余,也会关注一些贼好看的图表库和插件。 接下来,我将给大家介绍几款web/python/vue/react里漂亮得不行的开源库/实现。 ? 1....播放器里的颜值担当:Mini Music Player - VueJS ? 国外友人写的一个Vue.js音乐播放器,好看的不得了。 其中的交互和逻辑,也是非常精炼。...能在如此密集的数据量上保持动画流畅和美观的,也就微软爸爸能做到了。 我先跪了,你们随意。...这是个很有意思的实现,大致流程是: 手机开启浏览器 AR.js程序开始 ARToolKit识别到图片标记 A-Frame.js开始调用Three.js渲染 3D 模型 在画面上显示 ?...把 js 套件都约会进来 第 6 行:使用A-frame的html标签添加一个a-scene摄像头并把AR.js崁入 第 7 行:标记Marker如果标记的Marker出现在摄像头里就会执行下方的事情

    2K40

    前端开发:如何写一手漂亮的 Vue

    所以,越发体验到,当必要有计划的去做,去写,去玩,去嗨,利用好这荷尔蒙分泌还算旺盛的时光,去厚积去博取,去发现去折腾;让自己的生命不在仅是工作与惆怅,还有时间分与“诗和远方”。...目前犹身为前端开发者,且在使用 Vue,那么就有了此文;这不仅是纪录或分享,也是在漫漫之路上下求索,更希望能探讨和指点,以资见识,提升其效。...;那加以利用的各种工具,当如随身利器(小李飞刀?);那属于自己一套极致开发流程,便是轻功(电光神行步?)……如是斯言,那么作为开发者的你,几技傍身耶?...而 Mac 这设备中堪称优雅情人的存在,更是居家良品。倘若,所处的工作环境没那么看重效率,或者未表现出该有的慷慨,则一定须善待自己的精力和时间,勇于将自己的开发环境打造精良。...运用设计模式原则,比如单一职责原则,将组件拆分抽离成更细粒度,保证组件功能单一,以提升组件复用行;再如接口隔离原则,采用稳定的服务端接口,将变化模块分离,使得组件得以解耦;在复杂的项目中,也是需要用到冗余

    1.2K20

    Angular、React 和 Vue 三大框架,Web 开发该如何选择?

    任何 Vue 应用程序都是使用 HTML、CSS 和 JavaScript 编写的——熟悉这些工具就可以立即投入工作。...虚拟 DOM 则只更新必要的 HTML 块。 社 区 React 是世界上最流行的框架,这已不是什么秘密。它越来越受欢迎,因为它提供了真正的 Promise。...图片来源:https://www.madewithangular.com/ Angular 借鉴了服务器端开发中的一些最佳特性,并用它们来扩展浏览器中的 HTML 标记。...例如,对于 Web 应用程序,我发现,使用 Angular 比使用 ReactJS 更方便。 你可以自己尝试并比较不同的方向或技术。为此,你可以在谷歌趋势中输入一些关键字,它会为你画出漂亮的图表。...结束语 显然,这三个框架都非常强大,但同时又很不一样。它们有自己的优势和劣势,没有一个通用的公式可以用来决出一个绝对的赢家。选哪个框架好,要看你正在创建的应用程序和你的特定需求。

    1.7K30

    java文档注释报错,java文档注释主要使用方法「建议收藏」

    /*…*/用于多行注释,从/*开始,到*/结束,不能嵌套。 3./**…*/则是为支持jdk工具javadoc.exe而特有的注释语句。...,它以/** 开始,以 */结束....,它以 /** 开始,以 */结束,文档注释允许你在程 … JAVA文档注释标签 1 常用Java注释标签(Java comment tags) @author 作者 @param 输入参数的名称...数据库对于自增主键值的插入是顺序的 … vue2入坑随记(一) 都说Vue2简单,上手容易,但小马过河,自己试了才晓得,除了ES6语法和webpack的配置让你感到陌生,重要的是思路的变换...,以前随便拿全局变量和修改dom的锤子不能用了,变换到关注数据本身.vue的 … [code segments] OpenCV3.0 SVM with C&plus

    85820

    使用ESLint+Prettier来统一前端代码风格

    想起自己刚入行的时候,从svn上把代码checkout下来,看到同事写的代码,大括号居然换行了。心中暗骂,这个人是不是个**,大括号为什么要换行?年轻气盛的我,居然满腔怒火,将空行一一删掉。...首先,对应ESLint大多都很熟悉,用来进行代码的校验,但是Prettier(直译过来就是"更漂亮的")听得可能就比较少了。...使用ESLint配合这些规范,能够检测出代码中的潜在问题,提高代码质量,但是并不能完全统一代码风格,因为这些代码规范的重点并不在代码风格上(虽然有一些限制)。 下面开始安利,Prettier。...Prettier是一个能够完全统一你和同事代码风格的利器,假如你有个c++程序员转行过来写前端的同事,你发现你们代码风格完全不一样,你难道要一行行去修改他的代码吗,就算你真的去改,你的需求怎么办,所以没有人真的愿意在保持代码风格统一上面浪费时间...当然如果你自己写过AST的解析器,也可以用你自己的写的parser: require("./my-parser")。

    2.8K20

    (简易)测试数据构造平台: 3 (vue打通django)

    首先,先处理一下django项目: urls.py: 这里我们指定vue项目打包好后的文件地址的入口index.html 。...然后打开settings.py: 把我们刚刚pip下载好的插件塞进去:(注意位置第三行,主要解决跨域) 然后是html寻址路径,这里加上指向vue项目打包后的路径: 最后是在settings.py...结尾处加上vue项目的静态资源路径: (之后的截图都会包含上下文,以便同学们找到新增/修改代码的具体位置,而当事代码我会有那个红框或红线标记) django的部分到此结束,下面开始vue项目的部分:...jquery: (请耐心等待几十秒的下载和安装结束) axios: 执行完后,我们打开package.json看看 是不是出现了这俩个插件,出现即代表安装成功: 然后基本上就完成了本节课任务...: 然后输入网址:127.0.0.1:8000/home/ 看看进入的是不是vue的页面: 就发现了神奇之处,django项目的端口和网址,居然打开了vue的首页。

    41530

    HTML 基础

    核心技术点 网页组成 排版标签 多媒体标签及属性 综合案例一 - 个人简介 综合案例二 - Vue 简介 02-标签语法 HTML 超文本标记语言——HyperText Markup...超文本:链接 标记:标签,带尖括号的文本 标签结构 标签要成对出现,中间包裹内容 里面放英文字母(标签名) 结束标签比开始标签多 / 标签分类:双标签和单标签 需要加粗的文字的项目JavaScript,最后自己也走上了开源之路,现全职开发和维护 社会任职 2016年9月3日,在南京的JSConf上,Vue作者尤雨溪正式宣布加盟阿里巴巴Weex团队,尤雨溪称他将以技术顾问的身份加入Weex团队来做 Vue 和 Weex...另一方面,Vue 完全有能力驱动采用单文件组件和Vue生态系统支持的库开发的复杂单页应用。 Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。

    8310

    HTML基础

    核心技术点 网页组成 排版标签 多媒体标签及属性 综合案例一 - 个人简介 综合案例二 - Vue 简介 02-标签语法 HTML 超文本标记语言——HyperText Markup Language...超文本:链接 标记:标签,带尖括号的文本 标签结构 标签要成对出现,中间包裹内容 里面放英文字母(标签名) 结束标签比开始标签多 / 标签分类:双标签和单标签 需要加粗的文字的项目JavaScript,最后自己也走上了开源之路,现全职开发和维护Vue.js。... 社会任职 2016年9月3日,在南京的JSConf上,Vue作者尤雨溪正式宣布加盟阿里巴巴Weex团队,尤雨溪称他将以技术顾问的身份加入Weex团队来做 Vue 和 Weex...另一方面,Vue 完全有能力驱动采用单文件组件和Vue生态系统支持的库开发的复杂单页应用。 Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。

    17530

    如何写一手漂亮的 Vue

    所以,越发体验到,当必要有计划的去做,去写,去玩,去嗨,利用好这荷尔蒙分泌还算旺盛的时光,去厚积去博取,去发现去折腾;让自己的生命不在仅是工作与惆怅,还有时间分与“诗和远方”。...目前犹身为前端开发者,且在使用 Vue,那么就有了此文;这不仅是纪录或分享,也是在漫漫之路上下求索,更希望能探讨和指点,以资见识,提升其效——在晚晴幽草轩等着你。...;那加以利用的各种工具,当如随身利器(小李飞刀?);那属于自己一套极致开发流程,便是轻功(电光神行步?)……如是斯言,那么作为开发者的你,几技傍身耶?...倘若,所处的工作环境没那么看重效率,或者未表现出该有的慷慨,则一定须善待自己的精力和时间,勇于将自己的开发环境打造精良;倘若你被在使用 Winodws,不妨读下之前总结的 Windows下效率必备软件。...运用设计模式原则,比如单一职责原则,将组件拆分抽离成更细粒度,保证组件功能单一,以提升组件复用行;再如接口隔离原则,采用稳定的服务端接口,将变化模块分离,使得组件得以解耦;在复杂的项目中,也是需要用到冗余

    1.8K60

    如何简单理解 JavaScript 的 Async 和 Await?

    ,笔者在保证不改变原意的基础上做了调整,并在此基础上进行了错误校正,如发现问题,欢迎你的指正 开篇 自从Async 和Await 出现后,大幅简化JavaScript 同步和非同步(异步)的复杂纠葛,这篇文章将会分享我自己理解的历程...不容易理解的地方在于「中文」的同步和非同步,可能和实际上的解释刚好相反了(同步的中文字面意思是「一起走」,非同步的中文意思是「不要一起走」,超容易搞错的),因此如果你跟我一样也很容易搞错,可以使用我觉得比较好理解的方法...:「同一个赛道vs不同赛道」,透过赛道的方式,就更容易明白同步和非同步。...02 利用async 和 await 做个「漂亮的等待」 了解 async 和 await 的意思之后,就来试试看做个「漂亮的等待」: ?...haha0...haha5 ,最后再显示2」,而是「先显示1和2,然后再出现 haha0...haha5」,因为虽然代码逻辑是从上往下,但在count function里头是非同步的语法,导致自己走自己的路

    1.4K20

    最新前端Vue代码风格指南大全

    SVG 命名空间的元素 常规元素:其他 HTML 允许的元素都称为常规元素 为了能让浏览器更好的解析代码以及能让代码具有更好的可读性,有如下约定: 所有具有开始标签和结束标签的元素都要写上起止标签,...某些允许省略开始标签或和束标签的元素亦都要写上。...-- Comment Text --> … 3.1.2 模块注释 一般用于描述模块的名称以及模块开始与结束的位置。 注释内容前后各一个空格字符, 表示模块开始, 表示模块结束,模块与模块之间相隔一行。 推荐: 的 bug,但因为一些原因还没法修复;或者某个地方还有一些待完成的功能,这时我们需要使用相应的特殊标记注释来告知未来的自己或合作者。

    3.7K20

    手把手教你写一个AST

    我们知道 HTML 源码只是一个文本数据,尽管它里面包含复杂的含义和嵌套节点逻辑,但是对于浏览器,Babel 或者 Vue 来说,输入的就是一个长字符串,显然,纯粹的一个字符串是表示不出来啥含义,那么就需要转换成结构化的数据...字符串的处理,自然而然就是强大的正则表达式了。 本文阐述 AST 解析器的实现方法和主要细节,简单易懂~~~~~~~~,总共解析器代码不过百行!...但是属性名称我们也需要遵循原则,通常是用字母、下划线、冒号开头(Vue 的绑定属性用:开头,通常我们不会这么定义)的,然后包含字母数字下划线中划线冒号和点的。...~ AST 解析实战 有了前面的 HTML 节点的正则表达式的基础,我们现在开始解析上面的节点元素。...我们再循环处理 HTML 的时候,如果已经处理的字符,则将其删除,这里判断 last!=html 如果处理一轮之后,html 还是等于 last,说明没有需要处理的了,结束循环。

    1.4K20

    9个值得推荐的 VUE3 UI 框架

    Vuestic Vuestic 是 Vue 最漂亮的开源管理面板之一,擅长编写可维护的 Vue 代码,制作灵活的组件和接口。...Vuestic 已经凭借其漂亮的组件目录确立了自己作为最美观的 Vue3 UI 框架之一的地位。...Element+ 在 GitHub 上拥有 11.1k+ 颗星,正在成为 Github 上最受欢迎的 Vue3 UI 框架之一,它以出色的问题管理、及时更新、可插入组件和通过SCSS变量的高定制性达到了开发者的期望...Ionic Ionic 是最早提供 Vue3 支持的 UI 框架之一, Ionic 更倾向于移动 UI,团队知道如何迎合和维护一个优秀的 UI 框架。...Quasar 框架似乎是基于 Material Design,但是一旦开始,一切都可以很好地定制以适应自己的设计体系。

    4.8K30

    一个「学渣」从零开始的Web前端自学之路

    开始之初,我没有任何的语言基础,完全从零的小白开始,就连「对象」我都弄不明白,更别说那些高深莫测的什么封装,继承,多态等。 当时自己也不知从何入手,怎么办呢?...Markdown 中文文档 有道云笔记:我自己一直在用的在线 Markdown 编辑器。 HTML 篇 一些准备就绪之后,开始我们的学习之旅,首先我们先从 HTML 开始。...HTML名为「超文本标记语言」,是整个页面的结构基础,它承载了我们的页面内容。 1. 基础 w3school 在线教程:内容非常的基础,适合小白学习,对 HTML 有一个入门了解。...CSS 篇 HTML 承载了页面的内容,但是有时候会略显单调与「丑陋」,CSS 的作用就是为这些内容加上样式,就像一个美女也要有漂亮的外衣去修饰才会更加漂亮,「人靠衣装马靠鞍」,网页的内容也是需要穿上一件漂亮的外衣去吸引用户...前端入门和进阶学习笔记:从零开始自学,然后进入京东,记录作者一路走来的学习笔记。 六小登登:我自己的个人博客,记录自己的一些学习总结,个人成长,认识思维,虽然自己还是个菜鸟,但一直在路上。 2.

    1.8K72
    领券