安装 配置 nodejs pnpm

前面的课程我们部署了一套 java 后端的淘宝程序，这节课开始我们部署 low 的 gs 版本的淘宝， no 的结实版本的淘宝，它的运行效果是这个样子的，我单机运行， 它会在本机的三千端口启动一个 web server， 切换到浏览器，输入 local host 端口三千，你就可以访问到以 low 的 gs 为后端的淘宝。单击 其中的分类，可以看到淘宝里面的所有的商品。 接下来我们分几个步骤来实现。使用 note 结石部署淘宝网站。 第一个，下载并安装 load 结实配置 vs code 开发环境。第二个，设置 vs code 的字体大小。第三，使用 git 下载淘宝源码。 第四，运行 load 结实版本的淘宝源码。接下来把淘宝部署到 center o s 操作系统中，下面 我们去下载 vs code 的开发环境， 在浏览器当中输入三 w 点幺四七三点 c n 单机学生机房常用安装软件下载的，放大查看，找到软件开发目录， 进入 vs code 目录下载 git 下载 load 下载 vs code。 vs code 有两个版本，一个是减压即可使用的版本，一个是安装版本，大家可以自由选择我现在 下载减压即可使用的版本。单击保留保留保留。 下载完后单击文件夹图标，把刚下载的这些文件剪切到自己的文件夹里面， 双击 load 开始安装 load 结石， 单击 next 勾选协议，单击 next next 单机 next 单机 next 单机 install 单机 finish 完成 load gs 的安装。接下来我们双击 git 文件，安装 git 原码管理软件， 单击 in store 单机 finish git 安装完毕。接下来再打开一个命令行，在里面输入 load 回车能看到如下版本，表示， note 安装完成， 退出漏斗。输入 git， 能看到如下状态，表示 git 安装完成， 找到 vs code 安装包， 把它放到一个盘浮下面， 双击 vs code， 解压到当前文件夹， 解压完成后，找到 vs code 文件夹，把后面的这一些中文字符删掉。 双击 wes code 文件夹，双击 code， 点 exc， 单击 fire 里面的 preference 里面的 city 里面的 color。 semi 可以修改你的 vs code 的色调， 在这里有很多选项，大家可以根据自己的需要选择一个 适合的颜色。接下来切换到自己的项目文件夹，右键新建一个文件夹， 取名为淘宝店 load js， 点幺四七三多 cm， 打开 vs code， 单击文件 open folder， 打开一个文件夹， 选中刚才新建的这一个文件夹，单击，选择文件夹， 单击 yes。 接下来我们创建第一个 load g s 的 web server 文件，单击这里的 new file， 新建一个文件，输入文件名 start， 点 g s， 复制这一串编码， 粘贴进去，单击 run 里面的 run without debugging， 选择 low 的 g s 作为它的编译器。 在这一个第八个控制台，会启动一个 load js 的 web server， 它运行在这个 ip 的这一个端口下面，复制这一个地址，打开浏览器， 粘贴这个地址回车，你会发现它会显示 hello world， 这样你就成功搭建了一个 load g s 的 web 服务器。 关于 low 的 gs 与 git 的安装，我们就介绍到这里，谢谢大家的观看。

好嘞，各位，那么继续来讲一下如何去进行这个 note gs 的一个安装啊，其实也是非常简单，大家可以去找到我这个博客，或者是去某度进行搜索一下 note gs 相关的字样就可以了 哦，你如果你找到我的博客的话，你可以点一下第一个链接，这是一个英文官网，或者是点一下国内的一个中文网都是可以的。哦，我们可以看一下啊，那这个话就是一个英文官网，那这个 l t s 和这个 current 它又是什么意思呢？ l t s 呢？它就是这个长期维护的一个版本，就是建议呢是安装这个 l t s 的一个版本， 那这个 current 呢？就是一个最新的一个尝鲜版，对，就一些新特性在里边，就是你可以抢先去体验一下，你就可以装一下这个最新版，但是为了追求稳定的话，我们就装这个 l t s l t s 这个长期为 护板就可以了。好，然后你点开这个当漏的就是一个下载地址，然后你选择你这个对应的一个操作平台就可以了。比如说你是啊 windows 啊，还是麦 q 五 s， 或者下载他的原码去进行编译也是可以的。 你如果是 windows， 你就可以下载这个 msi 就可以了，他是比较简单的，他下载下来就是一个安装包。对，安装一下就可以了。对，比如说这的话给大家演示一下， 不过我已经装过了，我这给大家演示一下，如果你是麦克五 s 的话，你可以下载这个 pkg， 那这个的话其实也是一个安装包啊。好，当然你也可以去下载这个压缩好的一个包，注意啊， 你这个压缩好的包呢，你下载完之后要手动配置这个环境变量，而这个 m s i 呢，是帮你去自动配置好的。对，它其实就是一个安装程序啊，我们可以看一下。对，你看，其实我已经装， 我弄的我就不需要再装了，他就是直接让我结束了。对，你们弹出来就是一个这个东西，然后一直耐克的就可以了，就可以把这个弄的呢去给他进行这个安装完成 哦，那安装完成之后呢，我们怎么去检查这个 note 是否安装成功哦，然后你可以去打开这个命令。行啊， 你可以在这或者是这个 window 键加 r， 然后找下这个 c m d， 你如果是麦 q s 的话，你直接打开终端就可以了啊，然后把这个放大一下，你就可以试一下这个 note 杠 v， 看能不能输出。 好，那我这的话就是成功输出了，然后你可以再输入一下 n p m 杠 v， 看能否正常输出哦，也是升输出了，还有一个 n p x 杠 v。 好，那这三个东西呢，都是安装完 note g s 之后呢，它自带的。对，看一下这三个东西可以输出一个正确的版本号呢，就是没有问题的。好，那以上的话就是本章所有的知识啊。

好嘞，各位，那么继续来讲一下 note g s 第六张 n p x， 那 n p x 呢？它跟 n p m 是一样的，都是基于这个命令行的一个工具，同时也是在 no 的 g s 高版本之中呢，去自带的一个命令。对，如果你用的是非常非常低的版本，那你需要手动安装一下 n p x， 那你需要执行 n p m install n p x 杠 g 就可以了啊，那 n p x 它的作用呢？主要是可以在命令杭州呢，运行我们这个 note 包里边的一些可知性文件， note 的 modis 下面点并的可知性文件。在我们没有学 n p x 的时候呢，我们之前是使用这个 script， 然后在里面去配置，通过 n p m run 去给它运行。哎，我们学了 n p x 之后呢，可以直接使用 n p x 去运行，并且呢是不需 要安装这个依赖包的。对，我们本地运行呢，是不是还要去安装下这个依赖。使用 n p x 运行呢，是不需要安装这个依赖包的，所以说这个就是它的一个优势，就是避免全局安装它的依赖包，并且呢，每次使用的都是最新的版本， 并且它还可以执行任意的一个 npm 包。哦，那最后一个命令，大家只需要了解一下即可，这个用的并不多啊， 就是我们这个 n p x 呢，它也可以执行 get up 下面的一些可执性文件。对，但是前提是你的 get up 呢，要公开我们这个 javasque 文件，所以说这个功能呢，它是支持的，但是可能用的是比较少，比如说大家了解一下即可。好，那接下来是一道面试题啊， 就是 n p m 和 n p x 一个区别，那 n p x 呢？它主要是侧重于命令，比如说执行这个并下面脚本， 或者是运行一些全局的命令，这个是用的比较多的。而 n p x 呢，它主要是包管理工具，控制我们这个模块的什么蒸山改查，对，用的比较多一点，所以说这也是他们一个主要的一个区别。好，那接下来的话就给大家去演示一下 我们刚才说的这个如何避免全局安装和总是使用这个最新版本。哎，这两条是什么意思啊？哦，然后我把演示的网址呢，已经给他贴到这个博客里边了，大家来找一下就可以了啊。然后我们使用这个 react 的一个脚手架呢，去给大家展示一下。 好，那在之前的话，我们没有 npx， 那么是不是需要执行下这个命令，去给他把这个脚手架呢去装到我们这个全局？好，我们可以先看一下啊。好，这的话要给大家再介绍一个命令，这个命令也一定要记住啊，比如说我想看一下我全局安装 装了哪些可执行文件，注意啊，全局安装了哪些可执行文件？使用 n p m l s 杠 g。 对，这个命令一定要记住啊，不加杠 g 就是当前项目啊，好，回车 他就会给你列出来。好，我们稍等一下，大家看到，这是我电脑上装的一些全局的一些可执行文件，就是可以直接去给他调用的， 就是我们在之前的片当中展示过这个 t s 杠豆的，因为我把它装到了这个全局，但是我这个全局呢，并没有安装我们这个 rec 脚手架，所以说我们需要给它先安装一下哦，然后我之前这个命令啊， a p p。 好，我们稍等一下啊。好，安装完成之后呢，我们再来看一下 n p m l s 杠 g， 哎，我们会发现这多了一个 craich recta app， 多了一个这个命令，然后这个命令呢，就可以直接去给他执行了。对，比如说后面呢，可以跟一个这个项目的名称啊，比如说叉叉叉，对，你就可以去运行这个命令了，我们先不跟了， 咱们先直接输出一下，哎，发现这个命令是不是也是可以执行的？对，传统的方式呢，就是这样去做的，但是这样做有什么缺点呢？首先 注意啊，第一个缺点是什么？他这个版本就锁定了五点零点一，对吧？还有那这个东西是不是装到我们这个磁盘里边，占用我们这个磁盘的一个空间，对吧？这是他两个一个弊端，而 n p x 呢，他就可以完美的去解决这个问题。好，那现在的话我把这个命令去给他卸载掉啊， 同样也是 on install 加一个杠 g 就可以了。对，杠 g 就是卸载全局的一个包。好，一定 已经卸载完了，然后通过 n p m l s 杠 g 去看一下， 发现是不是已经没有没有了，然后我们再执行这个命令，发现是不是已经是执行不了了，但是 n p x 呢，就可以去帮我们去做这件事，比如我们切到一个桌面哦，然后使用 n p x 呢去执行这个命令， 然后呢，比如说创建个项目叫什么 my app， 好，我们回车一下，哎，发现他是不是能够，哎执行起来，对不对？ 我们并没有安装这个包啊，发现 npx 是可以帮我们去执行起来哦，他的查找规则是什么呢？注意，他的查找规则呢，是会去当前的项目里边看 note 猫就是下面的，并有没有这个可执行文件，如果没有就去全局找 全局，如果再找不到，他就会去这个安瓶官网上去给你把这个东西给你下下来，下下来等你用完之后呢，又给你删掉。对，这是他的一个规则啊，注意 啊，我们现在都没有，他应该是在帮我们去下这个依赖，下完依赖呢，把这个魅力执行完成，执行完成之后呢，又会把这个包给他删掉，所以说这个包呢，他就是一次性的。那这样的话就是什么 节省了我们这个磁盘空间，并且呢，他每次下载的时候呢，版本都是最新的，对他他就可以去解决这两个问题。 好，那这下载的话比较慢啊，我们就稍微等一下。好的，那这个项目呢，究竟是构建成功了，然后我们去切到这个 my app 里边，好，然后去运行下这个项目，看能不能运行起来啊。好，回车我们来看桌面上啊，对， 桌面上是不是已经有了这个 map 哦，然后其实也是可以运行起来。好，稍等一下。哎，网页呢也是打开了，对，基本上是没有什么问题的，那这样的话就可以避免我们这个 全局的安装，而且每次安装的是一个最新的版本。对，这就是一个 n p x 的一个妙用，很多的 c l i 呢，都是推荐他们去使用的，比如说 max， g s， 还有这个 rex 以及什么 wait price 等等，都是怎么去推荐这个使用的。好，那这个的话就是它的第一个使用场景，然后我们再演示它的第二个使用场景，好，我们先把它关掉啊， 好，这些都关掉。那第二个使用场景，我们说过它可以运行我们这个呃， note modules 点并的一个可执行文件哦，比如说我们现在执行下 wechat 哦，现在是执行不了。然后呢，我们再去看一下全局我有没有 装过位车，还是通过 m p m l s 杠 g 哦，我们可以看到发现我全局是不是也没有装过这个位车哦，然后我们可以在本地检索一下，就是通过 m p m l s 就不加杠 g 了，就是检索本地的那种模式，发现是不是也是空的 哦，什么都没有。但是呢，我就想运行这个 vit 的命令，是不是也是可以的？对，你可以直接使用 npxvit， 咱们说过他从本地检索不到呢，他就去全局找全局找不到就干嘛去给你安装啊？如果他能找到的话，他就会在本地呢去给你做一个执行，所以说我们可以安装一下 n p m i h 杠 d。 好，然后我们直接执行 white 也是执行不了的，因为什么？因为我们这个稳定的目录没有在 环境变量里边配置啊。所以说这时候我们可以通过 n p x 位车哦，然后他就他呢就会去找这个 note 猫，就是点并下面的位车帮我们去运行起来，所以他是可以帮我们去执行这个命令的。哎，发现是不是也是启动起来的，而且是非常快的，因为他能找到 它，能找到就不需要，咱就下载了嘛，对吧？所以说它是可以运行我们这个命令的，那以上的就是两个 n p x 使用的一个场景啊。

下面我们开始上课了，那么我们接下来的目标是什么？目标只有一个，就是采用 voe 三的版本，加上 spring boot， 加上买 c 口数据库，做一个前后端分离的基于主流技术的 这么一个新闻在线的一个系统，这么一个网站，可能后台的管理工作我们没有太多的时间去做，但是这个网站的效果我们会给大家呈现出来。 那么在上一个视频里啊，那么我进行讲解了， 就是 i j d k 一点八， miver 三点五， id 二零二三零二这个组合，这个组合呢就是一个 后端扎哇开发就是 springboot 的一个环境，咱们所有的这个带电脑的同学都已经装上了，是吧？ 然后这个视频呢，我给大家说一下，就是 v o e 项目，就是前端的 v o e 项目要用到的 note g s 的安装和配置过程， 我新建一个文件夹，叫做二零 二三幺幺 幺三吧，对吧？然后杠幺就是， 嗯， 这里我给大家放一个软件， 然后呢就是下一步，下一步就可以需要 你指出的就是你想给他啊，放到什么盘什么位置，你就选择一下选择的路径，切记两点，一不允许有空格，二不允许有中文，对不对， 是吧？然后呢，接下来配置环境变亮，假如说我啊我呢，把这个软件装到了一盘的根部路下吧， 是不是撞到根部路线了，然后这个时候 ctrl c 复制上面这个路径，然后找环境变量在哪里？ win 十和 win 十一不太一样，是不是？是不是啊？ 然后呢，接下来在这个 t a t h 里面，把这个 note g s 加上，是不是？是不是啊？加上之后呢，你就可以在任意的路线下去用这个 note g s 了，大家注意看啊，那么我们测一下 note g s 好不好使， 我们怎么测？有一个命令叫做什么呀？ node 杠什么一吧，然后就能知道他的莴笋版本十四点十八， 然后呢点三，对吧？是不是？这个版本咱装的是不是统一的，对吧？ 那么有关于咱们前端主要采用的是 h t m l 五加 c s s 三加 v o e 三，然后呢使用这个前后端分离的这样的一个项目，就前端是 一个项目，后段是一个项目，对不对？而且还使用这个像点什么脚手架啊之类的这些东西。 那么我们除了有这个 note g s 之外呢，我们还有一个 h b o 点 x 吧，对不对？这是一个绿色的软件，大家呢把它进行放到你的电脑里，然后把这个 h b o 点 x， 点 e s e 呃，放到桌面快捷方式就可以用了，对不对？这个大家是不是都知道啊？那么我把这个 h b u 点 x 也给大家放到这个百度网盘上， 这呢， 那么这个视频呢，咱们就录到这了。