### 1.2 准备工具：5分钟搞定开发环境 别担心，配置开发环境一点也不难！跟着下面的步骤操作，5分钟内就能开始写你的第一行JavaScript代码。 #### 安装VS Code（写代码的“超级笔记本”） **1. 下载VS Code** - 打开浏览器，访问VS Code官网： - 点击首页的“Download for Windows”按钮（系统会自动识别你的操作系统） - 等待安装包下载完成（文件大小约80-100MB） **2. 傻瓜式安装步骤** 1. 找到下载好的安装包（通常在“下载”文件夹），双击运行 2. 出现安装界面，点击“我同意此协议”，然后点击“下一步” 3. 安装位置保持默认（或选择你喜欢的文件夹），点击“下一步” 4. **重要**：在“选择附加任务”页面，勾选这三个选项： - ✅ 创建桌面快捷方式 - ✅ 将“通过Code打开”操作添加到Windows资源管理器文件上下文菜单 - ✅ 将“通过Code打开”操作添加到Windows资源管理器目录上下文菜单 5. 点击“下一步”，然后点击“安装” 6. 等待进度条完成，点击“完成”启动VS Code #### 必备基础配置（3步完成） **第1步：新建第一个文件夹** 1. 在电脑桌面上右键点击空白处 2. 选择“新建”→“文件夹” 3. 将文件夹命名为`my-first-js`（可以直接复制粘贴这个名字） **第2步：用VS Code打开文件夹** 1. 打开VS Code软件 2. 点击欢迎界面的“打开文件夹”（或按`Ctrl+K`然后按`Ctrl+O`） 3. 在弹出的窗口中找到并选中刚才创建的`my-first-js`文件夹 4. 点击“选择文件夹” **第3步：创建第一个HTML文件** 1. 在VS Code左侧的“资源管理器”面板中，点击`my-first-js`文件夹 2. 点击右上角的“新建文件”图标（或按`Ctrl+N`） 3. 将文件命名为`index.html`（必须是这个名字，包括.html后缀） 4. 按下Enter键保存 **第4步：安装“Open in Browser”插件** 这个插件能让你一键在浏览器中查看代码效果： 1. 在VS Code左侧找到扩展图标（像四个小方块的图标），点击打开 2. 在搜索框中输入“Open in Browser” 3. 找到第一个搜索结果（作者是TechER），点击“安装” 4. 安装完成后会显示“已安装” #### 认识两个核心工具 **VS Code：写代码的“笔记本”** - **作用**：专门用来写代码的编辑器，就像你写作业用的笔记本，但它有代码高亮、自动补全、错误提示等超能力 - **界面组成**： - 左侧：文件资源管理器（显示你的文件夹和文件） - 中间：编辑区域（你写代码的地方） - 底部：状态栏（显示文件类型、编码格式等） **浏览器（Chrome）：运行代码的“舞台”** - **作用**：把你写的代码“表演”出来的地方，就像戏剧需要舞台才能呈现给观众 - **如何使用**： 1. 在VS Code中打开`index.html`文件 2. 右键点击编辑区域的空白处 3. 选择“Open in Default Browser”（或按`Alt+B`快捷键） 4. 你的代码就会在Chrome浏览器中运行起来 > 编程金句：好的工具是成功的一半，但比工具更重要的是开始行动的勇气。现在，你已经拥有了写出第一个程序的所有条件！