以下哪些可以成为html文件的扩展名_今天在我的visual studio code里装了以下插件,现在用着很爽...

虽然我是一个后端开发,有时候也避免不了需要开发前端。目前需要我们使用iview开发一套后台系统,所以先着手学习一下Vue,虽然之前也接触了点Vue,但是断断续续,没有实际开发,所以全都还回去了。这次系统的学习,使用了vscode软件,开始的时候怎么用怎么不爽,然后百度,咨询前端资深小伙伴,装了下面这些插件,用着感觉‘刺激’多了。现总结出来,留以后备用,有需要的小伙伴也可以自取。或者小伙伴有哪些更高大上的,也欢迎推荐。

1、Chinese (Simplified) Language Pack for Visual Studio Code

英文水平有限,还是中文用着爽,所以装了中文插件。

3b92cd30723be50cdd0373de70526537.png

2、Auto Close Tag

自动添加HTML / XML关闭标记,与Visual Studio IDE或Sublime Text相同

94125476dc1a3b2204b407db1809cf11.png

3、Auto Rename Tag

自动重命名标签

重命名一个HTML / XML标签时,自动重命名配对的HTML / XML标签

92807e77f24d0960f0d1a6d414fe6b46.png

4、Ayu

颜色主题

be7930e4507d4080a20e534c4871dd75.png

5、Beautify

美化javascript,JSON,CSS,Sass,和HTML在Visual Studio代码。

d12cd786d2751902a11ef06ed69e9c68.png

6、Bracket Pair Colorizer

此扩展名允许用颜色标识匹配的括号。用户可以定义要匹配的字符以及要使用的颜色

5d2b8a734f78d070e2fea667a70e0615.png

7、Debugger for Chrome

953816c9bdcbe7f62af0b78d66189975.png

8、ES7 React/Redux/GraphQL/React-Native snippets

该扩展为您提供ES7中的JavaScript和React / Redux片段,以及针对VS Code的 Babel插件功能

39c0e58366c61f4c684add06c1c70eab.png

9、ESLint

将ESLint集成到VS Code中。如果您不熟悉ESLint,请查阅文档。

该扩展使用安装在打开的工作区文件夹中的ESLint库。如果该文件夹不提供扩展名,则扩展名将查找全局安装版本。如果尚未在本地或全局安装ESLint,请npm install eslint在工作空间文件夹中运行本地安装或npm install -g eslint全局安装。

在新文件夹上,您可能还需要创建一个.eslintrc配置文件。您可以通过使用VS Code命令Create ESLint configuration或eslint在终端中运行该命令来执行此操作。如果您已全局安装了ESLint(请参阅上文),请eslint --init在终端中运行。如果您在本地安装了ESLint,则可以.ode_modules.bineslint --init在Windows以及./node_modules/.bin/eslint --initLinux和Mac下运行。

be965803de61bbaa11101efa32adc2ee.png

10、Git History

查看和搜索git日志以及图形和详细信息。

查看文件的先前副本。

查看和搜索历史

查看一个或所有分支的历史记录(git日志)查看文件的历史记录查看文件中的行历史(Git Blame)。查看作者的历史

11、Git History Diff

查看git历史记录。查看提交详细信息。查看已提交文件的差异。查看git blame信息。查看存储详细信息。

GitHD旨在以最简单,最便捷的方式将最有用的git历史引入内部。

61ca3a7d888bd59979a1f03e469713cd.png

12、Git Merger

合并分支从未如此简单。

13、GitLens — Git supercharged

GitLens supercharges内置到Visual Studio代码Git的能力。它可以帮助您通过Git责任注释和代码镜头一目了然地查看代码作者的身份无缝导航和浏览 Git存储库,通过功能强大的比较命令获得有价值的见解,等等。

e0f2d46eef57ecff3aff55f4899ea756.png

14、HTML CSS Support

类属性完成。

id属性完成。

支持类和id属性的Zen Coding完成。

扫描工作区文件夹中的css和scss文件。

支持远程css文件。

使用vscode-css-languageservice。

f2f17817ad1a6b40e6d9fa417ebb1705.png

15、HTML Snippets

完整的HTML标签,包括HTML5代码段

8bff88e35dcc9a7ac8655e4978ecc691.png

16、JavaScript (ES6) code snippets

此扩展包含Vs代码编辑器的ES6语法的JavaScript代码片段(同时支持JavaScript和TypeScript)。

22f561c16c674399e49b4dc21a4a93c0.png

17、jQuery Code Snippets

超过130个用于JavaScript代码的jQuery代码段。

只需输入字母“ jq”即可获取所有可用的jQuery代码段的列表。

372324120efbbaac1b09b6eff6060980.png

18、open in browser

这使您可以在默认浏览器或应用程序中打开当前文件。

3dc37f0c3a7fb13115dcc39612cad406.png

19、Path Intellisense

自动完成文件名的Visual Studio Code插件。

f9f9b2205ef8ed629dd4d3a116f2c1c8.png

20、React/Redux/react-router Snippets

适用于Visual Studio Code的有用的React Ecosystem片段,包括:

快速导入

反应

Redux

react-redux

反应路由器

12a17cb560a909d3015c653f779585ae.png

21、Vetur

VS Code的Vue工具,由vue-language-server支持。

f5c7c0b99aefdbbef35da0e66a13d962.png

22、View In Browser

vscode扩展,可在浏览器中查看html文件。

4f5996bed2c7c0be4adb14c8b1e11d65.png

23、Vue 2 Snippets

此扩展将Vue 2代码片段添加到Visual Studio Code中。

这个插件基于最新的Vue 2的API添加了代码段

dd05b17a080528a561a104846efb4e64.png

24、Vue TypeScript Snippets

Visual Studio Code的此扩展为TypeScript和HTML添加了Vue / Vuex的代码片段

d762892415da385ddd100ade3f0741c1.png

25、vue-helper

该插件主要增强了Element-UI,VUX,IVIEW的写Vue和扩展的能力

1e90db404078c6f9c59b197929ba64a9.png

26、VueHelper

Vue,Vue路由器和Vuex的代码片段

3372a6224389d8857e096eed2006364e.png
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值