简介
Visual Studio Code (简称 VSCode / VSC) 是一款免费开源的现代化轻量级代码编辑器,支持几乎所有主流的开发语言的语法高亮、智能代码补全、自定义热键、括号匹配、代码片段、代码对比 Diff、Git 等特性,支持插件扩展,并针对网页开发和云端应用开发做了优化。软件跨平台支持 Win、Mac 以及 Linux,运行流畅,可谓是微软的良心之作……
Part one
下载
请根据自己的实际情况下载:
下面以Window10(专业版 64)为例。下载成功之后的文件截图:
Part two
安装
1.双击.exe文件,点击‘ 运行 ’按钮
2.点击接受协议,然后点击 ‘ 下一步 ’
3. 选择安装位置,点击‘ 下一步 ’
4. 根据个人习惯,决定是否将程序添加到菜单栏,执行下一步
ps: 个人不喜欢创建开始菜单文件夹,所以将蓝色框部分勾选。
5.选择快捷方式,点击‘ 下一步 ’
6. 安装
7. 安装过程及结果
Part three
简单配置
首次启动
设置语言支持
快捷键:ctrl + shift + p
点击使用:
选择期望使用的语言包
语言包安装成功之后,需要重启VSCode
重启成功之后,界面信息:
设置代码格式化插件
ps: 以PHP为例。
打开php文件,然后使用快捷键 alt + shiift + f。会有如下提示
根据喜好,选择安装格式化程序
格式化之后的代码
其他语言的格式化操作,大家可以自己去尝试,流程基本相同。使用文档
在’ 帮助 '–> ’ 文档 ’ 即可访问使用说明。
地址:
https://code.visualstudio.com/docs#vscode
Part four
使用
PHP项目为例:
在此之前,我们需要配置好php server,我本地用的是WampServer:(已有php server的请忽略该步骤)
php server WampServer
默认项目的工作目录是:你自己的wamp安装目录/wamp/www。如需修改默认工作目录,可通过修改:你自己的wamp安装目录/wamp/bin\apache\apache x.x.x\conf\httpd.conf 文件内容来指定你自己的工作空间
设置好php server之后,回到VSCode:
点击创建创建launch.json文件
将以下内容,配置launch.json文件中,ctrl + s 保存。{ // 使用 IntelliSense 了解相关属性。 // 悬停以查看现有属性的描述。 // 欲了解更多信息,请访问: https://go.microsoft.com/fwlink/?linkid=830387 // ${workspaceRoot} 当前打开的文件夹的绝对路径+文件夹的名字 // ${workspaceRootFolderName} 当前打开的文件夹的名字 // ${file} 当前打开正在编辑的文件名,包括绝对路径,文件名,文件后缀名 // ${fileBasename} 当前打开的文件名+后缀名,不包括路径 // ${fileBasenameNoExtension} 当前打开的文件的文件名,不包括路径和后缀名 // ${fileDirname} 当前打开的文件所在的绝对路径,不包括文件名 // ${fileExtname} 当前打开的文件的后缀名 // ${cwd} the task runner's current working directory on startup // ${lineNumber} 当前打开的文件,光标所在的行数 // ${relativeFile} 从当前打开的文件夹到当前打开的文件的路径 "version": "0.2.0", "configurations": [ { "name": "Launch Chrome", "request": "launch", "type": "pwa-chrome", "url": "http://localhost/${workspaceRootFolderName}", "webRoot": "${workspaceRoot}" } ] }
配置完成之后的界面
最后运行,看下结果
资料来源
vscode文档:
https://code.visualstudio.com/docs#vscode
wamp server:
https://www.wampserver.com/
/
关于Git的配置,比较简单,有需要的请移步自行百度这里(个人建议:还是使用手敲git命令的方式来处理版本控制比较有助于加深自己对 git 的理解)
/
关于快捷键,大家可以在 “文件”–> “首选项” --> "键盘快捷方式"里面搜索和查看自己需要的内容。
/
感谢阅读,祝工作顺利!