visual studio code新手入门

第一步安装软件

安装visual studio code软件(直接复制链接https://code.visualstudio.com/下载安装即可);

推荐大家直接下载稳定版本的(蓝色的那个);

第二步:安装插件

visual studio code新手入门

1、必备插件:

(1)、Chinese (Simplified) Language Pack for Visual Studio Code(简体中文扩展包)

如果你的英文超级好请忽略;

(2)、live server(说简单点就是帮你打开浏览器的;下面有详解)

2、实用插件:

(1)、Debugger for Chrome(在Chrome浏览器或支持Chrome Debugger协议的任何其他目标中调试JavaScript代码)

(2)、JavaScript Snippet Pack(片段代码提示包)

(3)、Path Intellisense(路径智能感知;可自动填充文件名)

3、优化插件:

(1)、Beautify(代码格式化)

(2)、Bracket Pair Colorizer(多彩括号)

(3)、主题Material Theme;One Dark Pro;Shades of Purple(紫色);

(4)、vscode-icons(很漂亮实用的文件图标)

第三步:简单设置

1、切换主题:

按如下操作执行选择你喜欢的主题就可以啦

visual studio code新手入门

 

visual studio code新手入门

 

2、控制字体大小:

快捷键:ctrl+/ctrl-

visual studio code新手入门

3、控制折行方式:

visual studio code新手入门

 

live server详解:

(1)、在窗口的最底部有Go Live可以点击,点击之后,就会自动在浏览器中打开HTML文件

visual studio code新手入门

如果同样的位置你的显示的是这个

visual studio code新手入门

那就点击它切换回GO live再点击!!!

(2)、在HTML文件中右键,然后点击open live server

visual studio code新手入门

(3)、快捷键 :(alt+L+O) 打开服务;   (alt+L+C) 关闭服务

(4)、智能化浏览器(了解详情有链接:https://github.com/ritwickdey/vscode-live-server/blob/master/docs/settings.md)

visual studio code新手入门

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/zwgfgs.html