我家小花儿

这个屌丝很懒，什么也没留下！

热门标签

【开发环境】Mac 安装 Visual Studio Code ① ( VSCode 简介 | 下载 VSCode | 安装 VSCode | 安装中文语言包 )_vscode mac

作者：我家小花儿 | 2024-08-15 16:20:53

踩

vscode mac

文章目录

一、Visual Studio Code 简介
二、MAC 安装 Visual Studio Code

一、Visual Studio Code 简介

Visual Studio Code 简称 VSCode , 是微软开发的一款轻量级 / 跨平台的代码编辑器 ;

VSCode 支持 Windows、macOS 和 Linux 操作系统 ;

VSCode 支持如下编程语言 :

JavaScript
TypeScript
Node.js
C++
C#
Java
Python
PHP
Go

VSCode 集成了调试器 , 可以调试上述多种语言 ;

VSCode 内置了 Git 版本控制插件 , 可以进行版本控制和代码提交 ;

二、MAC 安装 Visual Studio Code

1、下载 Visual Studio Code

进入 Visual Studio Code 官网 https://code.visualstudio.com/

在首页中 , 网站会根据浏览器的访问信息 , 自动判断出当前访问的平台 , 可以根据访问平台自动判断出要下载的软件版本 ;

在这里插入图片描述

点击下载按钮右侧的下拉菜单 , 可以选择下载 Windows / MAC / Linux 系统的 Visual Studio Code 软件 ;

在这里插入图片描述

2、安装 Visual Studio Code

下载完成之后 , 下载的 VSCode-darwin-universal.zip 文件有 218.7MB ;

在这里插入图片描述

双击 VSCode-darwin-universal.zip 压缩包之后 , 会自动解压到本地目录中 ;

在这里插入图片描述

将上述解压的 Visual Studio Code 文件移动到应用程序目录中 ;

在这里插入图片描述

双击 Visual Studio Code 弹出如下对话框 , 同意打开即可 ;

在这里插入图片描述

打开后的界面如下 :

在这里插入图片描述

3、安装中文语言包

启动 VSCode 之后 , 会弹出安装中文语言包提示 , 这里点击 " 安装并重启 " 按钮 ;

在这里插入图片描述

安装语言包完毕后的效果如下 :

在这里插入图片描述

4、编辑 html 并运行

打开一个空目录 , 创建一个 html 页面 ,

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <!-- 设置 meta 视口标签 -->
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no,maximum-scale=1.0,minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>JavaScript</title>
    <style></style>
    <script>
        // JavaScript 函数

        // 定义函数
        function add(num1, num2) {

            // 打印所有的实参
            console.log(arguments);

            // 返回返回值
            return num1 + num2;
        }

        // 函数有返回值
        var ret = add(1, 2);
        console.log("函数返回值 : " + ret);

        ret = add(3, 4, 5, 6, 7, 8, 9, 10);
        console.log("函数返回值 : " + ret);
    </script>
</head>

<body>
</body>

</html>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36

按下 Fn + F5 执行程序 , 会弹出选择调试器选项 , 这里选择 Web 应用 ( Chrome ) 选项 ;

在这里插入图片描述

在弹出的 Chrome 浏览器中 , 使用 Fn + F12 快捷键 , 可以打开浏览器的控制台 ;

在这里插入图片描述

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/我家小花儿/article/detail/984323