好的,那么迄今为止,我们已经看过 codex cloud 来远程运行任务。代码审查是为了审查 getsup 上拉取请求中的代码更改,而 codex c l i 是 为了在本地项目上工作。现在我想看看第四个 codex 工具,那就是 codex ide 扩展。 它可以插入到 vs code, cursor, windshaft 和 scold insiders 中。这个扩展与 vs code 的 co pilot 扩展非常相似,提供了一个更直观的界面,让用户可以与 ai 进行交流 并发起代码更改。但从底层来看,它基本上具有与 c l i 工具相同的功能,因为它允许我们在本地项目中使用 codex。 同样,在录制时,它在 windows 上标记为实验性。现在我在 mac 和 windows 上都使用过它。除了偶尔的抖动和一些 m c p 服务器的问题外,我在 windows 上使用它没有其他重大问题。 尽管如此,我依然觉得在 mac 上的使用体验更加流畅。在接下来的几个视频中,我将切换到我的 mac 进行录制。请注意,这在 windows 上仍然被认为是实验性的。 那么让我们回到代码并开始使用 codex 扩展。您需要做的第一件事是搜索扩展。我会搜索 openai codex。 如果您仅搜索 codex, 那 么一堆其他扩展会优先出现, 所以您需要安装的就是这个。一旦您完成了,您应该在这里看到 openai 的 标志。您可以点击它,打开 codex 面板。 现在,当您第一次这样做时,您需要登录到您的 chat 账户。就像我们在使用 codex c i l 时一样。如果您点击这个按钮,它会带您到一个登录页面,您可以在那里进行登录,因此我会选择离线登录我的账户。
粉丝1752获赞1.0万

来,普通人想要用 ai 去接管你的任何工作,你只需要有一个 open ai 旗下的大模型,叫 codex, 不 需要你去下载什么豆瓣元宝,什么 kimi, 你 只需要这一个大模型来跟着我操作。首先 开通一个 china gbt plus 会员,开通成功之后,他就会给你多一个五点二 thinking 这个模型。好,如果说你们现在一个月不愿意花二十美刀去购买,现在也有一些团队的拼车的服务,可以把价格打在二十块钱人民币以内一个月。 好,第一步,登录之后,在任何的 ai 编辑器里边,我使用的是 cursor, 你 也可以使用 vs code 等等在插件市场里面搜索 code x 哦, code x 搜索之后找到 open ai 官方的快捷插件,点击安装好,我已经安装好了。安装好之后就是这个页面使用切的 g p 登录,刚刚我们已经把账号和密码登录了,我们来回到这个 ai 编辑器里边。好,就是这个页面,我们一直点下一步,下一 步,下一步。好,这时候我们选择权限,我们给他,我们给他全部的权限。好, 我们给他完全访问的权限。为什么要完全访问的权限呢?因为风浪越大鱼越贵是吧?这个权限的意思就是你的电脑里边的所有的文件夹,所有的文件夹系统全部归 codex 管理,不管你是做呃编码工作,还是做各种文书工作,还是任何的需要你手动去呃办公的软件。不管你是想安装什么 opencloud, 就是 那个龙虾的机器人吗?还是想安装 cloudcloud 的, 还是想做一个 ppt, 还是想做一个 word, 还是想做一个 呃什么财务的、法律的、文书的那个全部在这个小黑框里面都能够实现,有不懂的可以问我。

今天我们这期视频只讲一件事情,就是普通人如何使用,如何安装 cloud code 并接入国产大模型 deepsafe。 你 是不是也觉得 ai 编程那肯定要写代码吧? cloud code 听起来好高级,跟普通人有关系吗?我的回答是当然有。 当我们接入 deepsafe 之后,可以利用它去写作,和 deepsafe 官网的模型是完全一样的,它不光能写文章,还能帮你去造工具,而且现在超火的 ai 技能插件 skill 最早就是可乐的 code, 玩明白的。安装好之后我们再安装 vs code, 那 它就可以实时操作,可以帮我们去开发网页开发工具,它的功能是非常强大的。 今天这期视频就是专门为你定制的,不用懂代码,不用找可用的支付方式去购买国外的大模型,只要你会复制粘贴,就能在十分钟之内装好可多的 code, 并成功接入国产大模型 deepsafe。 在 这里有一个前提就是网络环境 是处理好的,而且本期分享我会特意使用一台全新的没有安装过任何环境的 windows 十一系统来演示,会把所有遇到的问题给大家解决方法和步骤,让大家只需按照步骤操作就可以安装成功。实操环节,我会分享如何成功安装 cloud code, 第一次使用,如何起用可劳的 code, 如何接入 deepsafe 大 模型,然后如何利用编程应用制作一个个人主页。本期视频分享我们需要安装以下内容, 第一个就是 note 点 gs, 它是一个运行环境可拉的 code, 要靠它才能跑起来。第二个就是 g i t, 一个隐藏但比较重要的工具, windows 十一系统默认是没有安装的,如果没有可拉的 code 会无法使用。下一个就是 cc switch, 它可以一键轻松切换大模型,就像平时我们开关水龙头一样简单。第四个就是 vs code, 它是微软出的免费编辑器,长得就像记事本,但功能强大。以下就是本期分享我们需要安装的东西。 骚掩饰我会先分享 c l i 命令行界面。 altcode 本身是个命令行工具,英文叫 c l i, 意思是你可以在黑窗口里面打字指挥它,但大家别担心,我们装上 vs code 之后,使用插件百分之九十的操作都能用鼠标点出来, 不用死记命令。好了,下面我们直接开始实操,进入实操演示部分,第一步我们就需要安装 note g s, 在 这里我们不用命令安装,直接选择安装包,然后我们运行安装包,在这里我们就直接下一步,然后选择下一步,就直接下一步就可以。 好,这时候就安装成功了。安装好之后我们来验证一下是否安装成功,在这里我们按键盘上的,在这里我们按键盘上的 windows 图标加 r 键,这时候就会弹出运行窗口,在这里输入 cmd, 然后确定,这时候就会出现命令窗口,在这里我们输入 node 杠 v, 然后回车可以看一下,现在出了版本号就证明这个 node js 安装成功了。下一步我们就需要安装 cloud code, 安装 cloud code 我 们需要使用 powershell, 在 这里我们搜索一下, 搜索之后,然后右键选择以管理员身份运行,然后我们输入这条命令,直接回车。 好了,到这里就安装成功了,同样我们也是查看版本号的方法,查看是否安装成功,在这里我们输入一下命令,输入好之后我们回车可以看一下,现在已经出了版本号,二点一点三七,我们的 cloud code 就 安装成功了, 然后我们进入 cloud code, 直接输入 cloud, 然后回车可以看一下,现在进入出问题了,这时候我们就需要安装一下 g i t, 我 们来到 g i t 页面,然后选择保存,我这里保存到桌面上,然后我们开始安装,这里我们也是直接下一步, 下一步这些我们就全部的都是直接下一步 好了,这时候就安装成功了,然后我们再看一下,我们重新打开一个 powershell, 我 们重新打开一个 powershell 窗口,然后我们输入 cloud 可以 看一下。现在我们进入 cloud 是 可以运行了,但它又遇到一个问题,就是它有一个验证,在这里我们需要修改一个配置文件, 在这里我们来到我们的用户目录,我的用户名是 k, 我 这里直接输入,然后回车到这里就可以看到一个配置文件,就是 cloud 点 jason, 然后在这里我们打开编辑一下, 可以看一下,这里就是这个配置文件,在这里我们增加一个参数,增加之前这里我们需要有一个英文的逗号,像这个标点符号是经常会被大家忽略的,有好多朋友遇到问题就是增加配置,但大家增加好之后还是不能使用,就是因为这个标点符号的问题, 在这里我们添加添加这个配置项就可以了,然后我们再返回,然后我们在 c l o u d cloud, 然后回车可以看一下,现在就已经进入了,下一步我们再回车,这个提示就是是否在当前目录,然后我们回车 好了,这时候它就会让我们去登录 cloud 账号,因为 cloud 这个它国外的大模型最让人头痛的一个问题就是经常会被封号,所以在这里我们不使用它的大模型,我们要接入我们国产的 deepsafe, 在 这里我们 cloud 安装好了,然后下一步就是需要去接入 deepsafe 大 模型,在这里还用到一个工具,就是 cc switch, 现在我们再来安装一下, 我们来到 github, 然后我们去找安装包,在这里我们就直接往下拉,拉到底部,在这里我们找到适合我们系统使用的,在这里我选择三点幺零点三,如果是 windows 的 话,大家就选择这个就可以。好,现在保存好了,然后我们直接进入安装, 在这里我们也是直接下一步,下一步安装即可,这时候就安装好了,然后我们运行 下一步就需要我们配置 deepsafe 的 api, 在 这里我演示一下操作流程,在这里我们打开 deepsafe, 然后选择 api 开放平台,然后我们选择 api keys, 在 这里去创建,比如创建 api key c c 三,然后我们创建, 创建好之后我们复制一下这个 api key 的 这个密钥,然后复制,然后我们来到 c c switch 里面,在这里我们就选择右上角的加号,然后选择模型 zip, 然后往下滑,这里我们只需要填写一下这个 api, 然后添加, 这时候就添加好了,然后我们回到命令窗口,我们再进入 cloud, 可以看一下,现在已经不提示登录了,在这里我们输入斜杠 model m o d 可以 看一下,然后我们就选择第一个,在这里已经有了 deepsea v 三点二模型,现在我们去选择一下,就是第五个选项,让我们回车。好,这时候就选择好了, 选择好模型之后,在这里我们对话,我们问他一下你当前是什么模型,然后我们回车 可以看一下。在这里在此次绘画中,我作为 cloud code 实力实际使用的是 deepsafe v 三点二模型,到这里我们就成功地安装了 cloud code, 然后接入了 deepsafe 大 模型, 到这里我们就完成了 cloud code 命令行工具接入 deepsafe 大 模型,下面我来演示一下。我们在 vs code 里面使用 cloud code, 它的一个优势就是格式化操作,它的操作几乎都是用鼠标点击就可以, 然后我们下一步就需要安装 vs code, 在 这里我们选择宏框按钮,然后保存 好,现在保存成功了,然后我们安装在这里选择,我同意,然后我们直接下一步,这里就是选择一下安装目录,如果不选择默认安装到 c 盘,然后我们选择下一步,这里几乎也是全程下一步就可以,然后我们安装 好,这时候安装成功了,我们选择完成,在这里打开之后,它默认的是英文界面,看到英文不用担心,在这里我们需要安装一个插件就可以搞定,我们选择四个方块这里,然后我们输入简体, 我们就安装默认的第一个好,安装成功之后,右下角会有一个重启的一个提示,在这里我们选择重启。好,现在打开就是中文界面了,然后下一步我们就需要找到 colode code 插件,我们输入 colode code, 然后我们选择第一个安装, 在这里我们需要辨别一下官方版本,在这里我们安装,然后我们选择新任发布者和安装好了,这时候成功之后,在右上角就会多一个这样的一个图标,然后我们选择 可以看一下它,这里默认跳出的是一个登录提示,我们有了 c c switch 已经接入了模型,它这里就会跳过,然后在这里我们再输入你当前的模型是什么模型,然后我们发送, 可以看一下我当前运行的模型是 dipstick 为三点二,像这里也是这个 cc switch 在 这里起到的作用,像这里比如接入 glm 大 模型,或者是其他第三方中转的模型,用这个 都是可以搞定的,非常方便。好到这里就安装成功了,也成功接入了,下一步我们就让它帮我们生成一个个人主页,我们一起来看一下,在这里返回桌面,我先新建一个文件夹,然后回到 vs code, 然后文件打开文件夹, 我们选择桌面上的 myweb, 然后选择文件夹,这时候我们就用 cloud code 来对话,在这里我们输入提示词,就是我是一名专业的前端程序员,帮我生成一个自我介绍的个人主页,让大家可以快速的认识我,了解我,然后使用 html 格式,简约风格, 科技感配色,页面元素,要有自我介绍板块,联系方式,二维码区域,在这里就是我们给他的提示词,然后我们发送 好了,可以看一下,现在个人主页已经生成成功了,然后我们预览一下它给我们生成的一个个人主页,就是简历风格的,可以看一下,还是比较丰富的。在这里经过我的测试,就是我们使用可多扣的时候,不管是生成文章还是生成网页, 在这里我们要给他一个语言的提示,就是要生成中文内容,他有时候是默认的生成中文,有时候默认的生成英文,他这个是存在几率问题的。所以在大家生成内容的时候,强调一下生成中文内容, 这是目前想到的一个问题,分享给大家。这就是以插件模式使用的,在 vs code 里面还可以以命令行模式,在这里我们打开终端 使用方法是一样的,在这里我们输入 cloud 可以 看一下,就和我们在命令窗口使用的是一样的, 像这个一个优势,就是命令行模式加格式化窗口的模式可以直接使用,这就是我们所有的实操分享内容。在这里我也写了实操手册,比如安装好之后无法进入,或者是安装之后要验证,像这些遇到问题的解决办法,都有写到手册里面。 好了,到这里我们就完成了一整套从完全零基础到真正用起来的全过程。我们一开始什么都不懂,装好了克拉的 code, 配上了国产大模型 deepsafe, 在 vs code 的 里面,我们让 ai 帮我们生成了一个个人主页。其实克拉的 code 它有很多高阶的玩法, 你可能也听说过,比如 mcp、 gel, 但这些我也会慢慢讲,后面我会分享,但是这些都不着急,也不重要, 真正重要的只有一件事,就是现在先去试一试,先用起来,哪怕只做一件小事。 ai 时代最危险的不是不会用工具,而是以为自己用不了。 老的 code 不是 程序员的专利,它是每个普通人的效率工具。 ai 时代只要有思路就开始动手,就已经超过了百分之九十的人。 ai 时代,我们不用纠结新出了什么东西,哪个模型更厉害, 能帮自己提效的,自己用着习惯的,对自己来说就是完美的模型,完美的工具。好了,本期内容分享就到这里,我们下期再见。

我们后面要写正式的商业项目,所以前面那种用浏览器和记事本的编辑方式就不行了,我们要有正式的软件和环境,这一切我主要讲一下 vs code 的安装和使用,以及 note、 zs 和 get 的安装。 好,我们来到浏览器这边,打开这个网址,可以用 vsc 点 midol 这一点 com 跳转到这里, 这个网址就是我总结的一些我们必修阶段需要的一些软件和环境。然后浏览器的话安装很简单,所以就略过,你们这边尽量用 a 值,用不了的用可用,我这边都有链接去下载安装就可以直接使用。 然后下面我先讲云环境,云环境就是在厂商服务器上的环境,当你的电脑配置不行,或者说你自己安 装有问题的时候,那么你就直接使用云环境,云环境会默认配置好所有东西,我们直接使用就行。来这里我们先看 colod studio, 这个是腾讯云的, 点击登录,注册后可以直接用微信登录。进来之后我们看下面这个新建工作空间,点击新建第一个 on one, 他就会包含所有的语言和环境, 然后我们给他命名二一零一,选择仓库为空,然后创建,创建好后双击进入,等待一下就会进入。 我们先把模板关掉,然后左边这个就是文件夹栏,右边是欢迎页,我们先关掉,点左边新建一个文件,命名为 ext, 点 html 可以看到创建了一个 html 文件,输入 html 有自动提示,选择这个 htm 五,点击后就会自动补成一个空的模板。 我们先写一个 h 一标签,然后为了在他这里面能看到这个网页效果,我们来这边的插件市场拓展安装插件,这边选择 live, 可以看到有一个 live preview 插件,点这个安装,呃,他这个有一点问题,就是不会实时改变,所以我们退出一下再进来, 然后右键就可以看到这个来无 preview 选项数,就是展示,点击后右边会出现提示,点这个三千端口信息,打开内置预览, 可以看到这个网页出现了,我们修改文字之后刷新一下,可以发现它实时的修改 好这个 live preview 插件,他会帮助我们在云环境上起一个网站服务,然后看到网页,我们也可以在这边创建一个新的 htm 文件,用同样的方式给他输入模板, 写个 h 一标签,输入我是第二页, 再回到 index 首页这边输入 a, 创建一个 a 标签,把他的网址改成第二页的地址,输入前往第二页, 在预览这边刷新一下可以看到这个链接标签,点一下前往可以看到 跳转到第二页了,这就是两个网页之间的跳转。然后还有一个是可乐的 id, 这个是阿里云的,用阿里的账户登录之后也可以创建新的空间,这边我就先提前创建了一个, 这边的扩展是 live silver, 前面那个在阿林不能用,但这两种插件效果是一样的。安装后点右下角这个 go live, 它会自动打开五千五百端口, 这个单口是什么呢?比如说 ip 地址是你的小区,那么单口就是你小区的门,北门、南门这样, 这样每个端口代表一个门,所有的网络请求会从这个端口中进来,出去可以看到这边也是一样,实时修改后刷新这个网页,这个域名是云环境给的,可以暂时。 另外这两个是国外的,英语和网络不好不要看,有需求的同学自行选择。 下面是主要的问题,就是很多同学下载 vs 扣的下载不下来,因为网速很慢,国外的地址,然后我这边就用了加速连接。你可以先选择你的电脑版本,然后点击这边匹配你电脑的版本,然后你就可以看到他这个下载速度非常快。 下载下来之后打开点击,我同意,然后勾选这个全部,然后再下一步,下一步安装,安装好后直接完成运行就可以。刚进 来的时候很多同学说全是英文,看不懂,其实你只要稍微等三秒钟,右下角就会出现这个安装语言包提示,并显示语言更改为中文简体,你点安装并重启就可以了,重启之后看到已经是中文。 另外在这边点击插件市场也可以看到这个中文插件,我们先卸载掉,假如说你没有看到右下角那个提示,那么你可以来这边插件市场,然后搜索 chinese 中文,然后点击安装,重启一下就可以看到中文了。 visco 的左边依然是文件夹栏,我们点打开文件夹,可以选择桌面文件夹,当然你们也可以选择其他文件夹。我这边为了显示方便,就用桌面点开后 勾选这个信任,这个暂时不用管,也不用理解,勾选就行。可以看到左边已经是打开了桌面文件夹,这里面有我们桌面上的所有文件 index 点 s t m, 在这边是我们前面写的那些东西,然后我们再来安装一下插件,让使用更方便, 可以按照我列的这个目录去搜索安装。首先安装 preter 代码美化插件, 这个插件的作用就是会格式化美化你的代码。我们写代码的时候要有空格,要有换行之类的, 我们自己写的时候如果一直按空格按回车太麻烦了,对吧?所以我们要用这个插一键,让他帮我们自动格式化。在文件夹中右键可以配置默认的格式,选择格式化文档。 如果我们用自带的格式化功能,他会格式化成这样子,我觉得这个自带的 htm 格式比较难看,然后用这个 party 插件他就更好看一点。 然后安装一个翻译插件 wsen translate, 这个插件呢是我昨天找到的一个神器,它有一个翻译悬浮功能,也有两个快捷键,我们看一下 就是双击一个单词选中,然后把鼠标移上去,就可以看到上面出现的中文翻译,换一个 单词也出现了翻译宽度,对吧?这个就非常非常方便,大部分的代码其实都非常简单,只不过是我们看不懂英语罢了。所以的话有了这个翻译插件, 我们就可以看懂代码。然后他有两个快捷键,一个是 l 特加 t, 可以自行输入中文,然后翻译成英文,也可以用 l 特加 w 把选中的单词翻译成中文。 还有一个比较常用的功能是搜索跳转,这个功能是什么呢?就是我们碰上一些东西不会的时候就要去搜索,对吧?但是每次复制粘贴太麻烦了。 这个插件安装之后就可以一键跳转到搜索,我们这里安装,然后回到页面,选择一个单词,右键可以看到它上面有个 sexy online, 就是在线搜索的意思,默认是用谷歌搜索,但是谷歌大部分人上不去,所以要选这个 switch 换到这个病,推荐大家以后用病搜索,然后就可以看到直接跳转到搜索页面,不用复制粘贴,非常方便。 还有一个传斯类唐恩赖自动打开翻译网站也是比较方便, 但是我们有了那个悬浮翻译就不怎么会用这个,我们因为刚安装他这个插件有点问题,需要重启一下,按 f 一输入 restart, 选择插件速度重启可以重启, 然后点这个设置小图标就可以打开这个插件的设置。我们这边把他的默认翻译情改成 并。然后还有一个配置是显示在状态栏,勾选后翻译会在最底下的状态栏显示,比如说我们现在双击单词之后,可以看到右下角出现了翻译,这个也是比较方便,但是有点乱糟糟的,所以我还是把它去掉。有需要的同学可以打开, 所有插件的自定义设置都是这样的,点那个设置小图标,然后还有一个来 preview, 就是我们前面语文环境刚刚使用过的,在本地更好用。 搜索之后安装插件,它相当于给本地起一个网站服务器。以前我们打开网页,其实不是服务器打开,是用文件系统打开,然后这个打开之后可以看到是用使用服务器去打开 这里幺二七点零点,零点一是我们本地网络的 ip 地址,然后这个网站服务器在三千端口上,端口呢?还是那句话,就是相当于小区的门,所有流量都要从不同的门里进来,出去 有八零端口,有四四三端口,有六千端口,有五千端口,有三千端口,这样都可以。 然后再安装一个 vs code icons 插件,这个东西就是美化我们的文件的小图标,可以看到我们这边的小图标就变成了这样美化的啊,但是我觉得其实也没有,所以我就卸载了,你们需要的可以自行安装。 除了功能插件,还有一些主题插件,比如我们可以搜索 theme, 会出现主题插件,按 fe 输入主题,可以打开主题的设置,他这边 有很多内置的默认主题,比如说如果你喜欢浅色,那你可以选择浅色,如果你喜欢红色,可以选择红色,但还有很多其他的颜色,你们可以按照自己的个性,自己的喜好去配置,然后搜索出来,有很多主题,你们都可以去查看它,然后安装使用, 比如你看这个 atom 就是这样。 还有 winter is coming, 叮咚将至, 还有这个 material 主题,反正各种各样的漂亮主题,你们喜欢哪一个就用哪一个,这个是看你个人喜好的,随便都可以。 ok, 大概就是这样。然后插件的话,我这 暂时说这几个。再就是一些小配置, 怎么配置呢?就是点文件,点首选项,点设置,然后就会打开这个 vs code 的设置页面,我们先把 auto sale 打开,它会自动保存,当我们写完代码后,让它自动保存,就不用按 ctrl 加 s 了。下面是 fun size 字体设置大小, 可以看到这边显示字体会变大,这个就看你自己的喜好设置了。 还有一个是 for my town see you, 公选之后,保存文件的同时会自动格式化代码,你按保存它就会自动美化你的代码,不用你每次都右键去 点击格式化,很方便。 由我们这边来试一下。先写一个 d 五标签,可以看到 ctrl s 保存后,他会直接换行,而不用我们去敲回车。 然后再写一个 p 表现,他和前面一样, ctrl 加 s 保存后他会自动换行,不用我们再按回车,这样你就很方便。 然后再设置一下默认的格式化插件,我们选择 preteer 就行, 然后再设置一个林可以迪厅勾选 之后他会有什么效果呢?比如我们写的这个 p 标签,他前后两个开始和结尾,有时候我们写完前面的标签就忘了改,后面会出错,有这个之后我们改前面,他就会自动把后面的标签也改掉,这个写 html 的时候非常方便。 还有一个问题就是新版的 vs code 会对容易造成误会的标点符号进行提醒,比如说我们中文的分号和逗号等。 出现这个黄色的小框,如果你想去掉它,那么鼠标移动到上面,然后点调整禁运就行。 好,说完了 vs code, 再说一下安装这个 no 的 gs, 它是运行加挖 scrap 的后端框架,我们 进来这个链接之后,可以根据你的电脑选择不同的安装包,我这边就选择我的电脑是六十四位,然后点击打开,哦对,我这边因为原先已经有,所以的话这边是不男装更低版本, 我们也可以去 no 的 gs 官网去下载,这边搜索 no 的 gs 就会有这个官网,这边可以下载两个版本,我推荐你们下载那个 lts 的小版本,因为像这个最新的,他有时候会有一些不稳定的情况。 然后我们这边下载下来之后,点击我接受,再一直点 next 就可以一路下一步,然后点 install 就行,我这边就取消了,因为我有你。安装好后记得重启一下电脑,然后再安装这个 gate。 get 的话是版本管理系统,我们以后写代码需要版本管理是需要安装这个的。好,进来之后还是按照你的电脑是三十二位还是六十四位去安装一下,如果你实在不知道是什么,那你就安装三十二位也是可以的, 因为六十四他可以兼容。算上好像下载太慢了,我就不下载了,你们慢慢等。重启完之后回来这边点击新建终端,可以打开这个中端框,然后输入 no 的杠 v, 他会出现一个版本号,就是说明 no 的 gs 下好了。 其实云环境那边的配置和本地差不多,云环境基本上都是基于 vs 扣的做的,我们来这里搜索 party 插件,然后点击安装。这边的话安装会慢一点,但有些插件不兼容,比如说这个翻译插件在云环境就没有, 可以找个别的反应插件,比如这个也不影响使用。如果你电脑不行,或者说不想安装或者安装出错,一律建议使用零环境,哪怕他有些插件不能用,但足够你个人使用了,稍微有一点不方便而已。 我再来讲一下 vs 扣的的文件系统,左边这里相当于一个文件夹,我们这边创建一个文件之后,可以看到桌面上也自动会出现文件,大家懂了没?然后我们在编辑器中把这个文件内容改变之后, 回到桌面用记事本打开那个文件,可以看到他会出现一样的代码,就是说你在这边所做的所有修改都是会同步到我们这个文件夹里面的啊,相当于高级的记事本嘛。 我们也可以创建一个文件夹,同时看到桌面上也出现了文件夹,还可以拖动把原先的这个文件移动到文件夹里面,所以有这个文件系统后,我们就不用再切过来切过去设置各种文件了。 另外再创建一个 a 点 txt, 说明他不仅仅可以编辑 stm 文件,其他的所有格式文件都可以编辑,我们用文件管理器打开后也可以看到出现了, 然后我们在文件管理器上新建文件,可以看到 vs code 中也会同步显示新建的文件。 还有一个就是切换文件夹功能,比如说我们现在不想用这个文件夹的文件了,我们就选择另一个文件夹,这边我打开一个新的文件夹,就会出现新的目录,这个就是我们前面放图片的那个文件夹,然后也可以回到这个桌面。 另外还可以新建窗口打开第二个 vs code, 在这个多项目写的时候会比较常见,有不同的 vs code 窗口写不同的项目,同时在他们之间来回切换。 也可以在一个窗口中打开两个工作区,一个工作区其实就可以理解为一个文件夹, 可以看到这边的工作区里面同时出现的桌面文件夹和那个视力文件夹,两个都可以同时使用,就可以把第二个窗口给关掉了,这样的话在一些情况下比较方便。我们也可以把这个文件夹从工作区删掉,不是实际删除 好,删掉之后再打开装备文件夹回来,然后点一下文件,打开编辑器。我们现在来说一下几个常用的快捷键, 平常写代码的时候会比较常用,首先是 ctrl 加 d 会选 选择下一个相同的字符,就是当你选择一个单词之后,按一下 ctrl 加 d, 他会同时选择下一个,然后一直按会一直选,比如说我们这里按了三下就会选择四个相同的 p 标签,我们改他的话会同时改四个地方,这样的话非常的方便。 再就是按住 alt, 再按一下鼠标左键就会添加一个光标,也可以添加多个,多个光标同时添加之后我们输入文字,他会同时改变多个地方,这个功能也是非常方便。 ctrl 加 s 保存之后, ctrl 加 z 是撤销。然后还有一个是复制一行,我们可以用 alt 加 shift 加上下 下键就可以快速的把一行代码复制到上面,或者是复制到下面,我们用 ctrl 加 c 复制,还要回车之后调整位置,在 ctrl 加为粘贴,这样比较麻烦,但是我们有了这个快捷键之后,按一下就会复制一行,比较方便。 接着是查找 ctrl 加 f, 当你一个文件中的内容比较多的时候,我们想找一个字符找不到,就会用这个 ctrl 加 f 查找, 然后输入字符就可以拉开这个小箭头是替换,我们可以把查找到的东西按一下替换,替换掉我们需要替代的字符,然后右边是全部替换, 左边是单独替换,意思也就是字面意思点一下单独替换,可以替换一个单词,点一下替换,全部可以全部替换。 再然后是全局搜索,点左边这个搜索图标就可以搜索我们打开的工作区里面的所有文件的字符。比如说我们现在有两个 html 文件,输入搜索 html 的时候可以搜索到这两个文件家中的字符,我们点开之后可以看到一个是在 index 里面,一个是在 hi 里面, 这个全局搜索比较适合在多个文件中搜索东西。然后说完这个之后,我们再来看一下布局。 vs q 的很方便的一个功能就是可以分开创客, 比如说把一个文件放在两个窗口,这样的话适合在同一个文件的同时查看,两个部分 也可以适用于多个文件的同时使用。比如说我们这里先演示把上面这个抬头复制一下,然后在最下面粘贴进来,或者在右边的话中间也粘贴一下,可以看到 可以同时看到上中下三个部位,写的时候就很方便。你也可以用这边的布置设置,把它设置成两栏四栏,然后可以看到有四个部分都可以同时编辑, 然后外观这边还有很多东西,他们有不同的作用,你用的时候可以自行尝试,当然也可以不动,我的建议是不要动,前期的话不要折腾这些东西,因为他默认的就很好了,我们只需要知道怎么把他这个窗口 拆分什么的就行,然后选择这边还有一些常用的快捷键的按钮,也可以用这边的鼠标点击使用, 再回到这边首选项有个键盘快捷方式,这个页面里面就是所有的快捷键,你们以后如果想要什么快捷键都可以在这边搜索到查看到,也可以去修改,双击他的这个键绑定,然后输入你想绑定的快捷键就可以。 然后如果你不想改或者是冲突了,就可以再去把右键重置,按键绑定会恢复到原来的状态。这个的话先不用看,我只是说一下,哦对,还有一个帮助,比如说你们不会的时候可以点这个帮助开始,然后 在这边有他的一个小教程,也可以看一下他这个小教程,教你们学会更好的使用 vs 酷的。再接着我们按 f 一打开这个设置选项,我们可以看到有不同的设置,这里面有非常多的设置,直接输入功能的字符就可以搜索。 我们这边打开 live preview, 可以看到是乱码,因为我们这个文件夹是中文的,他这个插件不识别中文,所以我们以后写文件夹写文件名尽量要使用英文,因为中文在这方面确实支持不好,我们改成英文之后他就可以正常显示了。 最后我们把这些不用的可以删除掉,右键删除到回收站就行。好,那么本期到这里,本期的作业就是配置好你的环境,然后好好练一练所有的快捷键使用之类的东西。 下期我再补充一个用四 ss 写真实项目的案例,帮大家解决 css 的疑惑,拜拜。

不知道为什么,辛辛苦苦配置好 carson 自定义模型端点之后,开开心心的发出你好这个测试话语之后, carson 竟然罢工了,各位知不知道是什么原因?知道的话欢迎评论告知哦!那么我们不妨换一个方案, fisko 加口的 x 来替代 carson。 大家都知道 calculator 也是套 wordgo 的, 所以使用 wordgo 加 codex 插件是绝对没有问题的。 codex 是 openai 用于软件开发的编码代理,它可以帮助你编辑代码,理解不熟悉的代码库、 审查代码、自动化开发任务等。同样也支持 mcpos 图文输入等。通过配置也支持贵族流兼容 open ideos 的 大模型,比如酷狗专门 i g p t dsp 等。 接下来我们就来配置置顶一模。我们先从点击样式之后从三二 a 里获取 a p i t, 复制出来填入再点击继续进入到 codex 编码窗口,打开 codex 的 配置文件 config, 托 某复制以下内容到配置文件里,保存之后重启 windows go, 你就可以看见当前 codex 使用了自己定义的模型,模型显示卡斯特 gpt 五 codex。 接下来我们给他一些简单的任务,看他能否正常地执行。 很明显已经在执行了, 正在规划执行步骤。到这里是不是跟 qq 写代码是一样的?这个时候返回三二 a 控制台,效果也消耗了需要配置资料的麻烦。动动小手,一键三连,私信 codecs。

大家好,今天教大家如何去下载安装和使用 windows studio, 这也是咱们大一新生学习 c 语言或 c 加加的一个必备软件。首先的话咱们在这个搜索栏里面输入 windows studio, 然后就会得到这样一个 windows studio 的 网站,注意下这里显示 windows studio 不是 windows studio code, 咱们要选择这个第一个网站,点击进入这个网站,再选择下载, 咱们只要选择这个社区版就可以,这完全够咱们大一新生去学习 c 语言了。接下来咱们点击一下这个免费下载,接下来的话是不看这个右上角这里就会出现这个下载的提示。 这个下载过程还是比较长的,咱们稍微等待一下 viz studio 已经下载完成了,接下来咱们只需要去双击安装一下 viz studio, 然后这个点击试 点击继续。这就是进入这个安装过程了,因为我之前已经安装过了,所以他这个安装速度还是比较快的,如果你们是第一次安装的话,这个等待时间还是稍微比较长的, 咱们接下来继续等待一下,让他完成一些必要的更新。现在更新完成,咱们点击可用,然后选择第一个社区版本,然后点击安装,咱们去安装一些必要的,呃,主键就可以,然后选择这个啊,使用 c 加加的桌面开发, 接下来咱们就可以使用它来进行 c 语言或者 c 加加的学习,然后选中这个以后,这里还要注意下,它默认是安装到 c 盘里面,这里咱们可以更改一下, 比如说安装到其他盘里面,比如说我的地盘比较大一些,那我就安装到地盘里面, 然后他前面的这些路径咱们可以修改一下,然后给他安装到 d 盘,然后这个缓冲你们可以安装的,也可以安装到 d 盘或者 c 盘里面。接下来咱们直接点击安装就可以,主键安装完成以后, 咱们点击启动,选择第一个,如果无法登录成功的话,咱们选择关闭就可以再继续点击一下这个 继续,这里可以选择你的颜色主题,我就选择一个浅色的启动是 windows studio, 咱们的 windows studio 就 已经启动了,看这里咱们点击下文件新建一个项目,咱们只需要选择这个空文件, 然后点击下一步,然后这就是这个项目的位置,他默认是 c 盘里面,咱们也可以去修改一下他的位置,比如说从这个 c 盘给他修改到这个 d 盘里面,他的存储的 项目的地前面的路径咱们也可以修改一下,比如说咱们就给它放在 d 盘这个文件夹里面,然后继续点击创建,现在就创建好了。如果你要 写一个比如说 c 加加项目的话,咱们需要在这个点击原文件,然后右键添加新建项。如果 c 加加啊项目的话,后面应该是用的这个 c p p 结尾,如果是 啊 c 语言的话,咱们就直接选 c, 我 先拿这个 c 加加举例子,然后后面的结尾是 c p p, 然后添加就可以。如何调这个大小?如果字体过小,咱们可以按住 ctrl 键, 然后滑动这个鼠标的滚轮往前的话,是不是这个字体会逐渐变大,现在话调整到一个合适的大小。接下来咱们写一个 c c 加加项目,咱们首先要写一个头文件, 然后写上这个 include, 然后再写一个输入流,这里是 usual, usual name, usual name space。 按这个 table 键,这里要写一个麦函数,输入一下,这里 有一个括号,这个括号咱们要用这个英文的格式,咱们输出 c 加加,话用这个 cut, 这里写一个 hello world, return 零后,后面要有个分号,它前面这里 也是需要一个分号。如果你想调整格式,咱们可以按一下 ctrl k, 然后再按一下 ctrl d, 如果它这个格式这里出现,如果是对不起,你可以按一下 ctrl k, 再按一下 ctrl d, 是 不是它的这个格式会自动调整?现在是 c 加加,咱们运行一下,是不是它在控制台这里输出了 hello world, 咱们这就用 windows 丢丢完成了一个 c 加加的项目。如果是写 c 语言,咱们就可以再重新新建一个项目,点击这个文件,新建新建项目,选择这个空文件,点击下一步, 再继续点击这个创建,咱们就可以在这个原文件这里右键添加新建。像如果 c 语言,咱们后面将这个 p p 去掉,点击添加。接下来咱们就写一下这个 c 语言, 继续咱们要写一个头文件,写这个 include, 继续写上咱们的 main, 这里一个分号, 这里要注意一下。如果是 c 语言,咱们是不是要写一个 print 括号后面一定要写一个分号, 这里再写一个 hello world。 接下来咱们去运行一下 c 语言,是不是这里成功地说出了 hello world? 这就是 c 加加和 c 语言的啊,不同的写。呃写法, 咱们平时在学习时候要注意一下,如果是 c 加加,注意一下,它的后缀是点儿 c p p。 如果 c 圆的话,它的后缀是点儿 c。 感谢同学们的观看。

插件写得再好,发不出去也是白搭。分发效率直接决定了插件的生命力。在 vsco 的 生态里,分发逻辑其实很简单,就是私密和公开的双轨制。如果你只是想在团队内部快速跑通或者做小范围测试, 直接打包成 vsix 文件是最快的。这种方式不需要经过任何审核,发给同事就能装。但如果你想让自己的成果被全球开发者看到,那就必须走应用商店公开发布这条路。 搞清楚这两者的区别是插件从开发走向分享的第一步。在开发阶段,为了调试方便,我们经常会用 n p m link 把本地组建挂载到项目里。但在分享插件之前,这其实是个隐患。 你得先把这个本地连接给断了,进入你的子项目目录,执行 npm yunk。 这一步的作用是让你的项目断奶,不再依赖你电脑里那个特定的本地路径,避免别人安装时因为找不到文件而报错。 断开本地连接后,下一步是去 n p m 仓库把正式版本装回来,直接运行 n p m i, 加上你的包名。为什么要多此一举呢?因为只有这样,才能保证其他开发者在安装你的插件时,能拉取到一个完整可复现的运行环境。 你要确保的是,无论谁在什么地方安装,拿到的代码都和你测试时的一模一样。最后,别忘了清理现场。 开发时,为了让编辑器不报错,你可能手动写过一个 e t s 类型声明文件。现在既然已经装了官方包,它本身就自带了类型定义,你之前写的那个临时文件就没用了, 留着它反而会引起类型冲突,让编辑器发疯,果断把它删掉,保持项目结构清爽,这才是专业的做法。依赖理顺了。现在开始打包,你需要一个官方工具,叫 vsce, 直接用 n p m 全局安装就行。它是 v s code 的 插件开发的标配,不管是本地打包还是往商店发布,全靠它。 记住,一定要全局安装,这样你在任何插件项目里都能直接调用。装好工具后,回到你的项目跟目录,敲入 e s c e package, 这时候工具会自动扫描你的项目,把所有代码和资源封装成一个后缀,是 v s i x 的 文件, 这个文件就是你的插件安装包,你可以把它理解为插件界的安装程序。只要有了它,你就不再需要给别人发源代码了,直接把这个文件发过去就行。 拿到文件的人怎么装呢?很简单,在 v s code 的 扩展面板里点右上角那三个点选,从 v s i x 安装,选中你发给他的那个文件,插件就直接装进去了。 这种方式最适合在团队内部传阅,或者在正式发布到商店之前,先发给核心用户做一轮甄姬测试。 第一次运行打包命令大概率会撞墙、报错提示、没写仓库地址或者少了协议文件。这些琐碎的配置最消耗开发热情。这时候别去翻文档, 直接把终端报错甩给 ai, 它能瞬间看穿 package 点 json 里的漏洞,帮你补齐仓库字段,顺便生成一个标准的 mit 协议文件。这种脏活累活交给 ai 处理,才是最聪明的做法。打包成功只是第一步,体积才是硬指标。 如果你发现生成的 v s i x 文件有三十七兆,那绝对是个灾难,这意味着你把几千个没用的依赖包全塞进去了。这时候得靠 vs code 忽略文件, 让 ai 帮你写个配置,把开发环境的源码、测试文件,还有沉重的 note 下划线、 modules 文件夹全部排除掉。优化后的结果非常惊人,体积能从三十七兆直接缩减到四七三 kb, 文件数量从几千个变成十几个,这才是能拿的出手发给别人用的专业插件, 本地调试没问题,一打包安装就报错,提示找不到命令。这时候你如果去查命令注册逻辑,那就彻底跑偏了。真正的凶手藏在开发者工具的日制里, 你会看到一行报错。找不到 sharp 模块,这就是原声模块的坑。 sharp 依赖底层的 c 加加代码,它不是纯粹的脚本, 在跨平台打包时,极容易因为环境不匹配导致加载失败,只要它挂了,整个插件的激活流程就会中断,命令自然也就找不到了。既然原声模块在打包时是个定时炸弹,那我们就换个思路, 插件本身就有 webview 界面,那直接调用浏览器自带的 html 五 canvas 接口来做图片压缩不就行了? 这是浏览器的标准功能,不需要任何第三方依赖,更不需要翻译。把压缩逻辑从插件后端移到 webview 前端,不仅体积更轻,还彻底解决了跨平台兼容性的问题。这种绕过障碍的思维,比死磕报错要高效得多。 这种涉及前后端通信的重构逻辑非常绕,直接交给 ai 处理,关键在于你的提示词怎么写, 你要明确告诉他报错根源就是 sharp 模块。现在要求用 canvas 接口在 web view 里重写压缩功能。最重要的一点是,一定要加一句约束,不要改除其他问题。 ai 会自动帮你重新梳理消息传递机制。 按照这个思路,这种复杂的技术迁移一次就能修复到位。修完之后,记得做一次全功能自测,确保万无一失。 功能跑通了,接下来得给插件办张身份证。第一步就是换个头像。在 vs code 商店里,一个专业的图标能瞬间拉高信任感,操作非常简单, 准备一张 png 格式的图片,放进项目跟目录,然后在 package 点 json 里加一个 icon 字段,指向这个文件路径就行。别小看这一个图标,它是用户对你作品的第一印象,也是区分个人练手和专业工具的分水岭。 除了图标, package 点 jason 的 原数据就是你的宣传海报。 bind the film 是 给用户看的,正式名称要好记,最好带上核心功能词 description, 也就是简介。必须一句话说清你能解决什么痛点,别绕弯子。还有分类字段, 这直接决定了用户在搜索相关功能时能不能搜到你。把这些字段填精细了,你的插件在市场里才会有更高的权重和曝光率。这些细节决定了你的插件是躺在角落吃灰,还是被全球开发者一键安装。 想让全球开发者搜到你的插件,你得先在商店里有个合法的身份,登录 vscode 的 市场管理平台,创建一个发布者,这个发布者 id 就是 你在插件市场的品牌名。记住, 这个 id 必须和你代码里 package 点 jason 写的那个发布者名称一模一样,它是唯一的,一旦定下来,就会出现在你插件的网页链接里。所以起名的时候一定要慎重。 有了身份还得拿把钥匙,这把钥匙就是 p a t, 也就是个人访问令牌,你需要去 azure devops 后台生成它, 这里有个坑,一定要避开。在设置权限范围的时候,必须勾选市场管理权限,也就是 marketplace 下面的 manage 选项。只有开了这个权限,以本地的打包工具才能代表你把代码推送到商店里。如果这步选错了,后面的发布指令百分之百会报错。 特别注意,这个 p a t。 令牌生成之后只会出现一次,只要你把网页关了,就再也找不回来了。所以生成的瞬间请立刻复制,把它存进你的密码管理器里。 拿到令牌后,在终端运行 b s c e logging, 加上你的发布者名字,把令牌贴进去。到这一步,你的本地开发环境才算正式和全球插件市场接通了。这把钥匙你可千万得拿稳了, 要是拿到了,现在就是临门一脚。在终端输入 v s c e login, 加上你的发布者名字,把刚才那串 p a t。 令牌贴进去,完成授权。 接着直接运行 v s c e publish, 这时候工具会自动帮你完成最后的打包效验和上传。看到进度条跑完,你的代码就已经正式飞向微软的服务器了。 发完之后别急着庆祝,得去三个地方确认一下。首先是你的管理后台,看到状态变成绿色的在线状态才算数。然后打开 vs code 扩展面板,搜一下你的插件名,能搜到说明全球用户都能装了。 最后你还会得到一个专属的网页链接,这就是你插件的官方主页,直接发给别人就能看,非常方便。 发布只是开始,后续的更新其实更简单,你只需要在 package 点 jason 里把版本号往上提一位, 比如从一点零点零改成一点零点一,然后再次运行 v s c e publish, 商店会自动识别并给老用户推送更新。 到这里,你已经打通了插件从开发到发布的全部流程。下集我们会聊聊如何通过用户反馈和数据来持续优化你的插件。记得关注,别错过后面的实战干货。

兄弟们,最近智普发布了号称国产 ai 编程天花板的 g l m 五,今天我就教大家如何将 g l m 五接入 vs code, 配置完就能本地用 ai 写代码。老规矩,先点赞收藏,防止后面找不到了。我们打开 vs code, 点击左侧的扩展按钮, 在扩展的搜索栏里面,我们输入 c l i n e client, 第一个这个就是 client 的 官方扩展,我们点击这个安装,左侧这里就出现了一个机器人头像的图标,我们点击这个机器人头像图标, 我们就来到了 client 的 主界面,我们点击这个 api provider 里边 找智普的 z 点 ai, 这个 z, 点 ai, 这就是智普的模型。首先我们要上智普的网站申请一个 api, 点击这个链接,我们就会跳到智普的网站,在这里我们输入手机号,然后点击获取验证码, 选中这个同意用户协议,点击登录,我们就进入了智普的平台。点击右上角这里的 a p i k, 我 们新建一个点,右上角新建,在这里输入 v s code, 点击保存, 可以看到这里新增加了一条记录。点击 api k 这里的复制,我们就可以把这个 k 复制到我们的剪贴板里,然后回到 v s q 的, 在这个 api k 这里边,把这个 api k 粘贴进去。 模型这里边选 g l m 五,然后点击这个 down 按钮,就可以使用 g l m 五的这个大模型了。关注我每期一个 ai 编程知识,感谢大家的收看!

hi, 欢迎回来,那么这一节呢,我们就来尝试在 vsco 的 上编写一个简单的 react 应用。那么首先呢,打开我们的桌面,这里呢,我是以 mac 来做演示, 虽然是 mac, 但是我们使用的都是 vsco 的, 所以呢不会有太多的差别。那么来到我的桌面,在桌面这里呢,我还是一样创建一个新的文件夹,我叫做 section one。 然后呢,打开我们的 vscode, 打开 vscode 之后呢,回到我们的访答,也就是我们的桌面,同样的长按我们的桌面文件夹, 把它拖到 vscode 中,这样我们就能够打开它了。当然了,这里还有另外一种方法,我们可以在 vscode 的 上面,这里有一个 file, 那 么 windows 上应该是文件, 这里呢,我们可以通过打开文件或者是打开文件夹的方式来选择我们想要打开的文件夹,比如这里他给我跳转到了 desktop 之后,我点击 open, 这里呢也可以在 vsco 中打开我的桌面。要有了桌面之后呢,我们要在这样一个文件夹内去编辑内容的话, 其实还是需要跳转一步的,是吧?这里我们要做跳转的话呢,可以直接右键有一个在内置的终端中打开的这样一个选项, open in integrated terminal。 这里呢会打开一个东西,叫做终端,那么在 mac 上的终端呢,和 windows 上的终端是不一样的,但大致的功能呢,其实都是一样的,所谓的终端呢,也就是所谓的命令行工具 c l i, 全称就是 command line interface, 那 么相对的和我们的终端相应相对的工具呢,就是 g u i, 也就是 gui, 也就是所谓的图形化界面。什么叫图形化界面呢?其实就像我们平时用的软件,这里可以点可以看图片,这就叫所谓的图形化界面。那我们的终端能给我们提供怎样的能力呢? 我们可以在终端中呢直接操作里面的文件,也可以配合我们的 vsco 快 速的打开我们想要的文件。比如刚才我们的那个操作啊, 我现在 vsco 上虽然定位到了我的桌面,但是呢我不想打开桌面的所有文件,我想要在这个 section one 文件夹里面去编辑我们的代码。这种情况下呢,我们不管是 windows 还是 mac, 我 们都必须要在访答或者是 windows 上的文件资源管理器上打开我们的桌面,然后把对应的这个文件夹拖进来,这个操作说实话是比较麻烦的,有没有什么更简单的方法呢?很简单啊,我们在终端中只要进入了我们的这个文件夹。什么叫做进入了文件夹呢?或者说该怎样判断我们是否在终端中进入了一个文件夹呢?这里呢我们可以 使用终端的一些工具,首先呢,终端上面会展示当前这个终端所位于的文件夹的路径,可以看我们当前就位于我们想要进入的文件夹内,不管是 windows 还是 mac, 上面展示的这个路径相信大家都是一样的,那么一旦我们的终端定位到了当前的这个文件夹内呢,我们 就可以通过这样一个命令,通过 vsco 的 快速的打开我们想要打开的文件夹 code, 然后呢输入一个点 点,就代表当前的这样一个文件夹路径。输入之后呢,我们就可以看到 vsco, 它单独打开了一个新的窗口,而当然如果你的终端打开之后呢,发现没有定位到这个文件夹,该怎么办的?我们有两个方法,首先呢,我们需要快速的知道我们当前位于哪个地方,我们可以使用这样一个命令, pwd, 也就是 print work directory, 就 有这样一个命令的缩写,输入之后呢,它就能够打印当前的这样一个文件夹路径。当然这个命令在 windows 上面是 无效的,因为 windows 上面呢,也不需要这个命令,因为你的终端会自动地展示完整的路径,把这个终端关闭。然后我再想要打开终端的话呢,我们可以在上面点一下这里的 terminal, 也可以按一下键盘上的 ctrl, 加上反引号啊。反引号是什么键呢? 我给各位展示一个键盘,那么所谓的反引号就是这个键啊,就是 tab 上面的这个键,我们按一下 ctrl, 再按一下 tab, 就 可以在 windows 上面去切换我们的终端。如果是 mac 的 话,同样也是这两个键,按 ctrl 加上反引号,我们就可以快速的打开和关闭我们的终端。 只不过这个打开终端后的路径会展示我们当前这样一个文件夹,它的路径可以看到当前我们的文件夹位于 desktop, 所以呢,我们打开之后的这样一个终端,它的路径也位于 desktop 下面。 那我们想要从中端中进入这个文件夹的话,就像我刚才说的,我们可以右键点击在终端中打开,我们也可以通过另一个在终端中的命令啊,我们刚才学习了 pwa, 但这个命令呢,在 windows 上面无效,对吧?那我们接下来的这个命令呢,在 windows 和 mac 上都是有效的,它叫做 cd, 也就是 change directory, 就是 这样一个命令,我们通过 cd 就 可以切换我们的目录。首先呢,我们需要看一下我们当前这个目录有哪些东西,现在呢,我们知道我们的 desktop 下面有一个 section one, 那 我们可以 cd section one, 然后回车,这样我们的 路径就完成了切换。那我想回去该怎么办呢?通过 cd 两个点就可以返回到上一季的目录,那么很明显可以看到 section one, 它的上一级就是 desktop, 那 么我们输入之后呢,它就回到了上一级。那么需要注意啊,在我们的 cd 还有我们的目标目录之间中间有一个空格, 这里一定要注意,不然你不输入空格的话,它就会输入成这个样子,此时我们回车,它是识别不到这是一个什么命令的,我们的命令与参数之间一定要隔一个空格,这样它才能够正确的识别到 这个命令呢,在我们的 windows 上面也是同样奏效的,那么当我们的命令越输越多之后,可以看到它占满了整个屏幕。那么在 mac 上的话很简单,我们按住 ctrl, 加上键盘上的 l, 也就是字母 l, 就 可以快速进行清屏,这个非常的简单。那如果是 windows 的 话呢, 在你使用 cmd 的 情况下,我们可以使用 cls, 也就是 clean screen, 这就是 cls 这个命令的简称,这是在 windows 上面的用法。那么如果我们当前只有终端, 没有这个 windows 的 窗口的话呢,我们不知道当前这个目录下面有哪些东西啊,就比如我们在 desktops 下面,我们不知道这个桌面下面有哪些文件夹,我们该怎样进行判断呢?这里在 mac 上面,我们可以使用 list, 也就是 l s, 它就是 list 的 简写,它就可以列出当前这个文件夹内所有的文件。如果是 windows 下的 cmd 的 话呢,我们可以使用 t i r, 也就是 directory, 同样可以列出所有的文件内容。那么列出所有的文件内容之后,我们就可以知道下面有一个 section one, 然后我们再通过 cd 命令进入 section one 这样一个文件目录,这样我们就成功地通过了终端进入到了当前的这个 文件夹中,然后呢最后通过扣的命令再进入我们当前的文件夹。那么这就是最基础的 c l i 工具的使用,这个部分呢,不只是前端开发,各位未来如果想要学习后端开发或者是其他和计算机相关的一些 内容的话,命令行工具都是必不可少的。 ok, 那 么解决了命令行工具之后,我们接下来在里面创建我们本节想要编辑的文件。首先呢是点击这里的创建文件 按钮,我们创建一个 index html, 然后呢再创建一个 js 文件,我们本节不需要写样式文件创建好之后呢,在我们的 html 文件中,我们写上一个感叹号,然后按一下 tab 键, 让它自动给我们补全。然后再来到 js 中,在 js 中呢,编写我们想要编写的这样一些 react 代码, 那么这里的代码我们该从哪里去找呢?还有我们需要在 html 中去引入我们 react 的 c、 d、 n, 也就是像安装一样去安装 react 本身的话呢,这里安装的脚本我们又该去哪里找呢?这个同样也很简单,回到我们的搜索引擎,我们直接搜索 react cdn, 那 么第一个测试结果呢,应该就是我们想要的,这是 react 之前版本的官方文档,可以看到它下面就给出了这样两个 cdn 链接可用,那么我们要使用的是下面这个,下面这个 cdn 链接呢是可以用于生产环境的 复制,然后呢粘贴到我们 html 文件的 head 中间粘贴。那么我们之前也看到过,除了这两个 c d、 n 引入之外呢,我们还需要一个背包链接。这里来到我之前给各位提供的这样一个 blog, 好 的,就是这样一篇 blog。 在这篇 blog 下面呢,除了我们刚才复制的这两个来自 react 官网的 c、 d、 n 之外,它下面还提供了一个 babel, 这个也是非常重要的,因为我们想要在 react 文件中去使用 js 这种语法,也就是在 javascript 函数中返回这样一些标签的写法,我们必须要使用 babel 才能够起用这个功能。回到我们的 head 中去 粘贴这里的 bibble 链接,然后呢我们就需要引入我们的 javascript 了,那么在 javascript 中呢,我们需要设置它的类型为 text bibble, 这样我们刚才引入的 bibble 才能够正确地处理我们编写的 react 代码。那么我们写在 body 的 下面, script 在 这里写上 type text babel, 然后在这里写上 s 二 c, 引入到我们的 main js 中。那接下来我们就要在 main js 中呢去编写我们的 reg 代码,那编写的过程呢,其实很简单啊,这里我们完全可以直接复制它这里的写法, 但是呢,有一点我们一定要注意,我们整个 react 它返回的内容呢,一定要通过创建节点并挂载的方式呢,挂载到我们的 html 文件中,所以呢,我们需要设定一个挂载的节点,也就是说呢,在我们的 html 文件中,就需要像它这样 写上一个 id 和我们的节点相符的一个 d i v 标签啊,我们复制这里的写法,来到我们 html 文件它的 body 创建一个节点,那么待会呢,我们的 react 项目就要挂载到这个节点上,那么挂载的过程呢,我们先写出来, 其实就是下面这两行,看着很抽像,是吧?那我把这个里的过程呢给大家分离出来, ok, 这样分离出来之后,我相信大家就大概明白我们这里所写的代码它是什么意思了。首先呢,我们通过 get by id 的 方式呢,查找到了这样一个 id 为 root 的 元素,只是一个普通的 h t 妙元素,没有什么特别的,对吧?那么接下来呢,我们通过 rack 动和 create route 创建了一个 route 节点,这个所谓的 route 节点是在 react 概念中的 route 节点。然后呢,在这个 route 节点中呢,通过 random 函数, random 就是 渲染的意思, 通过 render 函数渲染了我们想要渲染的这样一个 app 组建。那这里为什么我要叫它组建呢?其实这个组建就是我们之前所写的这样一个可以返回 g s x 内容的 javascript 函数,那我们接下来来编辑这样一个 javascript 函数,所以它渲染的内容传进去的时候呢,它是以这样一个标签的形式传入的,但是呢,我们写的时候呢,还是要以函数的方式来写,这一点呢,比较奇怪, 但是呢,这是 react 固定的写法,我们来创建这样一个名字叫 app 的 函数,然后呢,下面就是我们想要返回的这样一些内容,这些内容呢,通过最后的 random 函数就可以渲染到我们的 d, i v 标签,它的中间这个位置 也就是这些内容。那么这里我们的 app 函数中间返回的内容呢,我们要自己稍微修改一下,写一个 h e 标签, hello from react。 然后呢,我想要在它的下面呢再编辑一些东西,那么这里我需要在 he 标签的下面再编辑一个元素的话呢,它们两个元素就并列 作为了根元素,但是呢,在 react 中呢,不能多个元素并列作为根元素,所以要在它的最外层包裹一个空标签, 也叫 fragment, 后面这个分号给它去掉。那此时我保存一下我们的 printer, 它就能够自动地完成格式化。在下面边写一个 input, 设定一下它的类型。 text, 同样的在下面写一个 p 标签,然后呢,我们通过 live server 来打开我们的这样一个 html 文件,右键 open with live server, 打开之后就是我们想象的这个样子,我们就可以针对性地去修改这里的内容了,比如我把这里的 input 给它 注视掉,然后呢,保存啊,此时左边的输入框就消失了,非常简单啊,注视的话就是 command 加这个正斜杠,也就是 forward slash, 再按一下 command 加正斜杠,它就消失了, windows 的 同学应该是按住 ctrl 来进行注视的。 好,我再把它还原回来。那么到此呢,我们就学习了如何使用 c l i 命令行,如何使用 vscode 创建一个简单的 react 应用。可以看到还是比较简单的,只不过呢,各位需要熟悉一下我们的 vscode, 该如何创建文件,如何编辑代码,以及如何通过 vscode 打开一个文件夹。当然最重要的是呢,我们的命令行请你一定要熟练。今天教给各位的 这样一些命令呢,相信也不是很难,但也非常的实用。那么具体我们是怎样实现这里的 input, 还有这里的 p 标签中文本的同步呢?我们就留到下一集再讲。这一集呢,只是带各位熟悉一下 vsco。 那 么以上就是本期视频的所有内容,希望你能关注或订阅我的频道,感谢你的观看,我们下期视频再见!

好,我们接下来简单的来介绍下,就是我们呃, get 怎么在这个 vs go 的 中进行一个使用啊?其实原理本质跟那个原理都差不多,然后 其实我们只要把这个底层的这些个命令,包括它简单的学员理理解了,其实这种图形化操作是很好操作的 啊,这是我们刚才的这样的一个项目,我们首先我们切换到我们这个 delete 部分值吧,我们也是同样,我们可能在这个下面我们进行一个一个更改,比如说我们新建一个项目叫 test, 呃,叫 test 零三 零三点,这样吧, 然后我们简单写一行代码,这块就让,嗯随便写一个代码吧,比如说我们写一个 public, 从这复制吧, 等于三,然后进行一个保存。然后通常情况下呢,我们需要,呃, 这个代码写完了,我们需要进行一个项目管理,我们点击这个右侧这块有一个原代码管理啊,原代码管理之后呢,可能有三个板块,第一个就是图形界面这个板块,然后又有更改为村支部,如果看不到的话,大家就把这个原代码管理把这块都勾勾起来啊,就可以了。 然后呢,呃,我们点击这个更改,嗯,其实就直接进行一个提交就可以了,其实你点这个小加号就把它放到这个 get a d, d, 然后 get commit, 点不点都可以啊,我们简单就进行一个提交,比如说我们就是,嗯,新建 新新,新建文件零三,然后我们点击提交啊,同样这个代码已经提交好了,我们可以看一下这个图形和界面啊,可以看到这块有已经有了一个新建, 哎,见不见咱的 development 啊,咱们点击一个新建终端这块,就能够把所有的这个树形都能够看得到, 比如说我们 d l 部分呢?就新建的这个文件零三嘛,对吧?然后我们现在给他需要同步到远程上,我们就点这个同步更改,但前提下你就要把这个远程库给添加上去,点一个三个小箭头,然后这块有一个远程添加远程库, 也是把那个 get 仓库员给放在上面就可以了,我们进行一个同步更改,这块我已经添加好了,就不需要再看到了啊,我们看一下这个界面有没有,我们可以看到这块已经有文件零三了,对不对? 同理的话,大部分情况下我们更改完之后需要也需要把它推送到这个主分支上嘛,对不对?主分支上,但是我们 现在只是在这个,呃,迪拜那么本地分支上进行主分支上,你看其实还没有这个文件,我们需要同样先给他合并吧,就是我们需要先合并到这个可能设备的不是那么特别好,我们用命令吧,那就这个大家还是推荐的, 推荐的大家去使用这个,嗯,但是他这个插件是花钱的,我们使用命令也是一样的, 就是只要理解这个过程就行,这块没有命令编辑,不对,没找到那个再看一下吧,然后我们现在是 get get log, 然后我们找到这个基本的一个操作,找到看查看分之 get brush 啊,然后我们当前在主分支我们进行合并就行了。这块有一个他这个比较好敲,我就不是他这个直接复制,我就不敲了, 然后给他名改过 diy 不 就行。 d e l o p。 好 哎,已经更改过来了,这回我们再上 vs go 的 看一下。看到了吗?我们主分支已经更改过来了啊。 嗯,其实他这个适配的并不是呢,不跟戴尔店适配那么特别好,我们主要需要。嗯,骑着面包车敲也可以啊,这样的话我们再把它推送到远程也是同样的原理啊。嗯, 心心见了颜色同步更改,确定给他拉上就行了。这会已经有了,同样我们就给他仓库,然后切换到这个慢分值, 然后也是有的稍写一下。 那可以看到 这样都是同步了的。好,就介绍到这里。

一、 ctrl 加 ko 选择文件夹也可以在选择框中右键新建文件夹, 然后点选择文件夹,能将其设置为默认的工作文件夹,下次再打开 vs code 会默认开启它,就可以对其中的文件进行操作了。 二、在左侧的工作文件夹窗口中,右键可以新建文件或新建文件夹,也可以左键双击 直接新建文件,这种方法更快一些。三、在文件上右键选在文件资源管理器中显示, 能在电脑中快速定位到该文件的位置。四、 ctrl 加 p 快 速打开文件,支持模糊搜索, 快速定位并打开文件。五、 ctrl 加 w, 关闭当前文件标签页, ctrl 加 tab 可以 切换打开的标签页。 六、 alt 加向上箭头或向下箭头,可以向上或向下移动当前行的代码。 shift 加 alt 加向上箭头或向下箭头,可以向上或向下复制当前行的代码。 七、光标在某一行的任意位置时, ctrl 加 x 可以 删除整行。 ctrl 加 c 可以 复制整行。八、 ctrl 加问号添加或取消单行注式。 shift 加 alt 加 a, 添加或取消块儿注式。 九、 ctrl 加 d 可以 选中光标处的单词。 十、 ctrl 加 shift 加 l 可以 选中当前选中的所有匹配项,方便批量操作。例如我选中偶数, 然后摁 ctrl 加 shift 加 l, 就 可以把所有的偶数都选中。十一、 alt 加点击在任意位置按住 alt, 点击鼠标可添加多个新的光标, 点错时可以用 ctrl 加 u 撤销上一次的光标添加或选择, 这样可以实现批量插入和批量删除。十二、 ctrl 加 alt 加向上箭头或向下箭头, 可以在上方或下方插入光标。十三、 ctrl 加 l 选择整行。 十四、 ctrl 加 delete 删除光标右侧的一个单词。 ctrl 加 box space, 删除光标左侧的一个单词。 十五、 ctrl 加左右中括号,缩进或反缩进。 十六、 ctrl 加 shift 加左右中括号,可以展开或折叠代码块。 你还知道哪些好用的快捷键?欢迎在评论区留言。

hello, hello, 大家好,我是阿牛。呃,今天我来教大家怎么样用 vs code 这个工具来在我们的 linux 系统里面进行一些简单的操作啊开发之类的东西。首先我们把它 vs code, 对,是一个非常非常强大的工具,插件非常多,非常适合我们做 it 的开放。 像找到一个叫做 w s l 呃,插件,这个是我们需要连接我们的。呃,前面装好的这个 linux 系统需要的这个插件,很快它就可以找装好了。好了,装好之后呢,我们 control shift p new w s l window。 对,我们就点这个好了,你可以看到右下角它在写说啊, stopping s code in one to bla bla。 这就是我们前面装好的这个 linux 的子系统,他在做一些基础的配置,我们稍等一小下。 嗯,可以了,我们可以打开看一看啊东西, ctrl 加一左边的那个波浪线打开。哎,看到没有,这就是我们的命令行,是不是我们先创作好类似的。 是的,太棒了,所以我们就可以在这里做我们想要的开发啦。这就是一个特别方便的 linus 环境,即使你只有 windows 电脑,你一样可以在 minis 上 做很多学习啊,或者是练习的东西。 好的,今天的内容就是这样,希望你们能从今天起就开始练习这个练词技能,我们下期再见,拜拜。