![6660e16735d6ed3bb1e94188137abc2c.png](https://i-blog.csdnimg.cn/blog_migrate/28796bca81029d7d0ff97ab59005e2ec.jpeg)
怎么了,小粉,愁眉苦脸的
小粉刚刚一个问题找了半个小时,居然。。。
小黑居然怎么样?
小粉说了你不许笑我蠢,,, 找了半个小时,
居然因为少写了一个括号?
小黑哈哈哈
小粉你还笑,这效率,
看来今晚又要加班了o(╥﹏╥)o
小黑别苦着脸了,试试这几个vscode插件,
保证你开发效率提上来
小粉真的吗,我看看... ...
vscode 插件 Rainbow Brackets 编码过程中,尤其在我们使用js进行函数式编程时,代码里会有很多的花括号,想要保证它们对称十分困难,所以就出现了上面小粉同学的尴尬局面,相信很多人都遇到过类似的情况。 Rainbow Brackets ,可以将同一对花括号给定相同的颜色,可以一眼就看出配对的两个花括号。 Indent Rainbow Indent Rainbow 则可以给代码的缩进提供颜色上提示,和 Rainbow Brackets 这搭配使用,可以在代码层级较多时,也能看起来很清晰,一目了然。
![ac83218d66ba56b0f8effccc4d8434f3.png](https://i-blog.csdnimg.cn/blog_migrate/77516575704e05d7ef22d7bf687b9f90.png)
![7ae3bbd91bc5c6a163b6e510a06c86bd.png](https://i-blog.csdnimg.cn/blog_migrate/fbeae24839e14f59d879b50347371e5c.png)
![0afeb1ed62357acc78cc24106d3f5b07.png](https://i-blog.csdnimg.cn/blog_migrate/4d8f3b77e6d3945a7e269bdbbbb9b5de.png)
![d26a0ca433c7822ed03caeb9d3b5eb27.png](https://i-blog.csdnimg.cn/blog_migrate/1095af400949cd16a595f7179c34bf1a.png)
![ea996fef0415b4e4a9a73abe3fb53a9d.png](https://i-blog.csdnimg.cn/blog_migrate/e6e6fc0c3c3e5df91fc7e663a09ac7cf.png)
![6bd0ec1226608daaaf6958d6a116fa44.png](https://i-blog.csdnimg.cn/blog_migrate/74d8a7f4e09bb55d9ac3a618bc6700de.png)
ESlint可以在我们在coding的时候,分析我们的代码,对有错误或不符合规范的地方,给出提示,让我们第一时间发现代码的问题。同时,还能在保存时,帮助我们自动修复一些问题。
![6146c3ac10579e4e849da6fac8b1079a.png](https://i-blog.csdnimg.cn/blog_migrate/007bff7297b45853f0e378a8dc8e0924.png)
关于eslint的更多使用方法,请戳 谈谈前端代码规范
Path Intellisense
Path Intellisense可以智能提示路径,并帮我们自动补全路径
![1865186dfeae3163e9640a32d7da839f.png](https://i-blog.csdnimg.cn/blog_migrate/cfc87a577b05cc845381bf15c5ff9dee.png)
Document This
可以帮我们快速生成代码注释,比如一些函数的注释,能够自动抽取出参数的定义。比如下面的函数,只需在上面输入/**, 就会自动触发 Document This插件,生成如下的注释。
![3c1989e202844769323c7c731115fecb.png](https://i-blog.csdnimg.cn/blog_migrate/0c770cfefb9ec7af7f8f05dff4711458.png)
小粉
哇,感觉好棒啊,我都要用起来,
你刚刚给我说了插件有
Markdown Preview Enhanced,还有,,,
还有啥了,我记不住了
小黑。。。 。。。 。。。猪脑子
小粉你刚才都说哪些插件了,再说一遍!
小黑那你晚上陪我看电影,我就告诉你?
小粉啥???我晚上要加班呢?
小黑有了这些插件,你还用加班呢?!
小粉是哦,那好吧。
如何分享插件 分享插件,除了将插件名字告诉你的小伙伴,当然还有其他的办法了! 可以在项目的 .vscode 目录下创建文件 extensions.json 。然后给 recommendations 提供一个想要分享给同伴的插件的 ID 数组,这样当他们打开项目,并且没有安装某些插件时,VS Code就会提示安装了,并且可以一键全部安装。
![99a80a09865d687ff0ab41095e92f704.png](https://i-blog.csdnimg.cn/blog_migrate/4b69ed86be29dcead767ff873833bdbb.png)
{ "recommendations": [ '2gua.rainbow-brackets', 'oderwat.indent-rainbow', 'alefragnani.project-manager', 'wix.vscode-import-cost', 'jaspernorth.vscode-pigments', 'eamodio.gitlens', 'shan.code-settings-sync', 'shd101wyy.markdown-preview-enhanced', 'dbaeumer.vscode-eslint', 'christian-kohler.path-intellisense', 'joelday.docthis' ]}
可以直接复制上面的代码到自己项目的.vscode/extensions.json 文件中,一键安装本文介绍的所有插件。
recommendations数组中是插件的ID,不是名字,插件ID可以在这里查看。
![0ed95d9a28cb8b9ab1266905b76a8f95.png](https://i-blog.csdnimg.cn/blog_migrate/2cad38c13b65dac70d505c004a85b969.jpeg)
小粉
哇~ 一下子就都安装上了,好赞啊
小黑嘿嘿嘿,别忘了去看电影啊~
小粉最近 「哪吒」比较火,要不就看它?
小黑好呀,我们下班走起
小粉看完电影是不是太晚了?没地铁了咋办
(小黑偷笑,,,此处省略××字,具体情节请自行脑补)故事纯属虚构,如有雷同,纯属巧合。祝大家提高效率,不再加班! 相关链接 Markdown Preview Enhanced文档 : https://shd101wyy.github.io/markdown-preview-enhanced/#/zh-cn/
![839bbbe360eea34018bc4a1002caf64a.gif](https://i-blog.csdnimg.cn/blog_migrate/849a77c03f58a8895debac88b4622acc.gif)
初识Threejs,一起学习成长
长按关注 “初识Threejs”
把有用的知识,分享给更多人
![03939c2b02e72f64aae8105eb14891fb.png](https://i-blog.csdnimg.cn/blog_migrate/2311df9e64718d12c4fbb1c2dcaa1567.jpeg)
你“在看”我吗?
![6f2e067b4acf3d0e7bb4a8386aa22956.png](https://i-blog.csdnimg.cn/blog_migrate/d7d74b59aea8c798e6e709477f8155e5.png)