前端开发 - Vscode软件前端开发环境构建

vscode是免费开源的,可以直接在官网下载

网址:https://code.visualstudio.com/在这里插入图片描述

vscode怎样设置成中文模式

( a )按快捷键Ctrl + Shift + P , 在vscode顶部会出现一个搜索框

在这里插入图片描述

( b ) 输入configure language,然后回车 ,vscode里面就会打开一个语言配置文件

configure language 配置语言
在这里插入图片描述

( c ) 将en修改成zh-cn,按Ctrl + S保存设置,然后重启该软件

![在这里插入图片描述](https://img-blog.csdnimg.cn/20200520150937472.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2d1Y2hlbmd5aXhpbg==,size_16,color_FFFFFF,t_7

( d ) 结果

在这里插入图片描述

创建工作区

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

前端开发必备插件

(1) 安装插件的方法

在这里插入图片描述
在这里插入图片描述

(2) vscode-icons

让 vscode 资源树目录加上图标
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

(3) Live Server

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

有时会遇到Live Server失效的情况

此时浏览器不能自动开启,但手动打开浏览器输入地址有效。
这个问题不易解决,可使用View In Brower代替

(4) View In Brower

在浏览器中预览页面
在这里插入图片描述

扫描二维码关注公众号,回复: 11253538 查看本文章

(5)Markdown Preview

猜你喜欢

转载自blog.csdn.net/guchengyixin/article/details/106236375