在vscode中创建并保存代码文件需先新建文件（ctrl+n或cmd+n），输入代码后通过ctrl+s或cmd+s保存，并在另存为时输入正确扩展名（如.js、.py）以识别语言类型；2. 文件扩展名决定vscode的语法高亮、智能感知和工具集成，是编辑器正确解析代码的基础；3. 可通过“文件”→“打开最近”或欢迎页的“最近”列表快速访问近期编辑的文件或文件夹，推荐使用“打开文件夹”功能管理项目；4. 保存后的代码可通过集成终端（ctrl+~或cmd+~）运行，如输入python或node命令执行脚本，前端文件可安装live server扩展实现浏览器实时预览。
在VSCode里创建并保存你的第一份代码文件，其实并没有想象中那么复杂。你只需要打开软件，新建一个空白文件，然后把你想写的代码敲进去，最后选择一个合适的位置和文件名保存下来就可以了。关键在于保存时要给文件一个正确的扩展名，这样VSCode才能知道你写的是哪种编程语言，并提供相应的帮助。
解决方案
开始在VSCode里写代码，我们通常从创建一个新文件开始。这个过程比你想象的要直观得多。
首先，启动你的VSCode。你会看到一个简洁的界面，可能有一个欢迎页或者你上次打开的项目。
接着，我们要创建一个全新的文件。最快捷的方式是使用快捷键：在Windows或Linux上是
Ctrl + N
，在macOS上是
Cmd + N
。你也可以通过菜单栏操作：点击
文件 (File)
，然后选择
新建文件 (New File)
。这时，你会看到一个名为“无标题-1”或者类似名称的空白标签页出现在编辑区。这就是你的新文件了，它现在还只是内存中的一个临时文件。
现在，你可以在这个空白文件里自由地输入你的代码了。比如，如果你想写JavaScript，可以敲一行
console.log("Hello, VSCode!");
。如果你是Python爱好者，那大概会是
print("Hello, VSCode!")
。你会发现，当你开始输入时，VSCode会尝试根据你输入的内容，或者当你保存时给出的扩展名，来猜测你正在使用的语言，并提供基本的语法高亮。
代码写好后，就是保存了。保存操作同样有两种常见方式：
快速保存（第一次保存会弹出“另存为”）： 使用快捷键
Ctrl + S
(Windows/Linux) 或
Cmd + S
(macOS)。另存为： 通过菜单栏点击
文件 (File)
，选择
另存为 (Save As...)
。或者使用快捷键
Ctrl + Shift + S
(Windows/Linux) 或
Cmd + Shift + S
(macOS)。
当你执行保存操作时，会弹出一个文件保存对话框。在这里，你需要做几件事：
选择保存位置： 浏览到你希望存放这个文件的文件夹。建议为你的项目创建一个专门的文件夹，保持整洁。输入文件名： 比如
my_first_script
。指定文件扩展名： 这是最重要的一步！VSCode需要这个扩展名来识别文件的类型。比如，JavaScript文件通常以
.js
结尾，Python文件是
.py
，HTML文件是
.html
，CSS文件是
.css
。所以，如果你的文件名是
my_first_script
，而你写的是JavaScript，那么完整的文件名应该是
my_first_script.js
。
点击“保存”后，你会发现编辑器标签页的名称从“无标题”变成了你刚刚设定的文件名，比如
my_first_script.js
。这表明你的文件已经成功地保存到了硬盘上。
为什么VSCode保存文件时需要指定文件类型？
保存文件时，那个小小的文件扩展名（比如
.js
，
.py
，
.html
）可不是随便写的。它对VSCode来说，就像是文件的身份证，决定了VSCode会用哪种方式来“理解”和“对待”你的代码。说白了，你写的是JavaScript还是Python，VSCode全靠它来判断。
没有正确的扩展名，VSCode就不知道该给你的代码提供什么样的“服务”。最直观的体现就是语法高亮：一个
.js
文件会有各种颜色来区分关键字、字符串、变量，而一个没有扩展名或者扩展名是
.txt
的文件，可能就只是一片单调的白色文本。这不仅仅是美观问题，更是阅读和理解代码效率的关键。
除了高亮，扩展名还影响着VSCode的智能感知（IntelliSense）功能。比如，当你输入一个对象名后敲下
.
，VSCode会根据语言特性为你列出可能的方法和属性。如果它不知道你写的是什么语言，这些强大的代码补全和错误检查功能就无法正常工作。
存了个图
视频图片解析/字幕/剪辑，视频高清保存/图片源图提取
17 查看详情
更深层次一点，许多语言特有的工具链集成，比如代码格式化（Prettier）、静态代码分析（ESLint）、调试器配置等，都依赖于正确的文件类型识别。如果你写了一个Python文件却保存成
.txt
，那么当你尝试运行或调试它时，VSCode可能无法正确地调用Python解释器。所以，别小看这个后缀名，它是VSCode智能工作的基础。
VSCode中如何快速打开最近编辑的文件或文件夹？
写代码不可能只写一个文件，项目会越来越大，文件也会越来越多。VSCode在这方面做得挺好，让你能轻松管理这些零散的文件，甚至整个项目。当你关闭VSCode又想回来接着上次的工作时，或者想快速切换到最近处理过的另一个项目，有几种非常方便的方法：
一个是我个人非常常用的，就是通过
文件 (File)
菜单里的
打开最近 (Open Recent)
。点开它，你会看到一个列表，里面包含了你最近打开过的文件和文件夹。直接点击你想打开的那一个，VSCode就会帮你快速定位并加载。这个列表非常有帮助，尤其是当你同时在处理好几个不相关的项目时。
另一个方法是利用VSCode的欢迎界面。当你没有打开任何文件或文件夹时，VSCode通常会显示一个欢迎页面。在这个页面上，你会看到一个“最近”区域，里面也列出了你最近操作过的文件和文件夹。点击它们也能达到同样的效果。
对于管理整个项目，我更推荐使用VSCode的“工作区”概念。你可以通过
文件 (File)
->
打开文件夹 (Open Folder...)
来打开一个包含你所有代码文件的根目录。一旦一个文件夹被打开，VSCode的侧边栏就会显示这个文件夹里的所有文件和子文件夹，形成一个树状结构。这样，你就可以在左侧的“资源管理器”视图中轻松地浏览、创建、删除和重命名文件了。当你在一个项目里工作时，这种方式比单独打开文件要高效得多，因为它让你能一览无余地看到整个项目的结构，快速在不同文件间跳转。
VSCode保存文件后，如何运行或预览我的代码？
文件保存好了，那下一步呢？当然是让它动起来，或者看看效果。VSCode本身是一个强大的代码编辑器，但它不是一个运行环境，不过它提供了一些非常直接的方式来帮你实现这一点，不用你跳出编辑器。
对于大多数编程语言，比如Python或Node.js（JavaScript），最直接的方式是使用VSCode的集成终端。你可以通过
视图 (View)
->
终端 (Terminal)
，或者更快捷地使用
Ctrl + ~
(Windows/Linux) 或
Cmd + ~
(macOS) 来打开它。这个终端就像你电脑上的命令行工具一样，可以直接运行你保存的代码文件。
举个例子：
如果你保存了一个Python文件叫
my_script.py
，你可以在终端里输入
python my_script.py
然后按回车。如果你保存了一个Node.js文件叫
app.js
，你可以输入
node app.js
。
这样，你的代码就会在VSCode内部的终端里运行起来，并且输出结果也会直接显示在这里。
如果你正在开发Web页面（HTML、CSS、JavaScript），你可能更想在浏览器中看到效果。虽然你可以手动去文件管理器里找到你的HTML文件，然后双击用浏览器打开，但VSCode有更酷的方式。我个人非常喜欢一个叫做“Live Server”的VSCode扩展。安装它之后，你只需要在HTML文件上右键，选择“Open with Live Server”，它就会自动在浏览器中打开你的页面，并且当你修改代码并保存时，浏览器会自动刷新，这对于前端开发来说简直是神器。
对于更复杂的项目，VSCode还内置了强大的调试功能。你可以通过
运行 (Run)
菜单或者左侧的“运行和调试”图标（一个虫子形状的图标）来配置和启动调试会话。这通常需要一些初始配置，但一旦设置好，你就可以设置断点、单步执行代码、检查变量值，这对于找出代码中的问题（bug）来说非常有用。虽然对于新手来说可能有点超纲，但了解它的存在，对你未来的学习很有帮助。
以上就是VSCode怎样创建第一个代码文件并保存 VSCode新手创建与保存文件的基础操作技巧的详细内容，更多请关注创想鸟其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至 chuangxiangniao@163.com 举报，一经查实，本站将立刻删除。
发布者：程序猿，转转请注明出处：https://www.chuangxiangniao.com/p/468342.html
微信扫一扫 
支付宝扫一扫 
