IT数码 购物 网址 头条 软件 日历 阅读 图书馆
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
图片批量下载器
↓批量下载图片,美女图库↓
图片自动播放器
↓图片自动播放器↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁
 
   -> JavaScript知识库 -> NPM包管理工具 -> 正文阅读

[JavaScript知识库]NPM包管理工具

前言

NPM包管理工具,可以帮助我们管理各种各样的安装包的依赖关系,帮助我们使用jQuery或者bootstrap的时候,可以不用把整个包放入文件夹中才能使用。接下来让我们来一起学习NPM的相关知识。


一、认识NPM

npm(全称Node Package Manager,即node包管理器),是Node.js默认的、以JavaScript编写的软件包管理系统” npm来分享和使用代码已经成了前端的标配。这是它的官网

npm是Node.js默认的软件包管理系统,安装完毕node后,会默认安装好npm,npm本身也是基于Node.js开发的软件,下载Node: 官网


二、NPM的安装、镜像的设置和使用

调查和更新NPM,我们需要打开电脑上的命令提示符:

通过电脑的搜索功能来打开他。

根据图的方式来下载。

我们可以根据npm install npm -g的格式,来更新不同的写法比如下载jQuery我们就可以使用:

npm install jquery -g的方式下载,但是注意这个是全局的安装,就是在哪里都可以使用的意思。如果你只是希望给某个文件夹里放置,你需要通过cd的指令进入到新的文件夹,如果你要切换磁盘,则可以输入D: 的格式切换,然后cd 进入想要的磁盘。之后你只需要执行npm install jquery就可以在这个文件夹里下载了。更多CMD指令介绍

?

有的同学可能会遇到一些特别的情况,比如我,我在npm install npm -g自我更新的时候,出现了这样的提示:

idealTree:npm: sill idealTree buildDeps

然后我就长时间卡住了,这是因为NPM属于外网数据,而我们没办法快速的下载他,这个时候就需要使用镜像的方式。

?用这样的方式去尝试重新下载,更换NPM的镜像设置,就可以成功下载了。我使用了的是这里的第一条指令:npm config set registry https://registry.npm.taobao.org?,不过并没有加后面的--global,不过从结果上是验证成功的,使用了npm config get registry检查是正确的。

?大家根据自己的情况去使用对应的指令就可以了。


三、NPM的使用

NPM的使用,我们可以通过继续使用CMD命令指示符继续使用操作,也可以通过webstorm的软件打开CMD面板操作。

接下来的常用的指令操作:

?当我们去下载jquery的包或者其他插件的包。然后尝试进行一个包的查看,我们就会看到这样的文件夹和包:

当我们给cmd面板输入指令来获得配置文件,就会获得一个package.json的文件:

?配置文件的作用是什么呢?主要就是展示安装包的信息,自己书写安装包,或者用于进行一些指令的包装。让我们看看它的一些属性:

?当我们使用npm init --yes的时候,如果不使用--yes,则是初始化文件并且可以自己修改内部的信息。我们再去查看我们创造的package.json,其中有一个属性叫做scripts(脚本)的属性,他内部的数据是可以用于书写一些你自己想要的执行方式,可以通过 npm run xxx(指令的名字)的方式来实现这个过程。比如你运行了里面的test:

?如果你进行了一个指令的书写:

?

?他就会执行对应的代码方式。

同时我们注意到还有一个文件叫做package-lock.json的文件,它的存在其实就是锁定依赖包的信息,点开可以知道他是从哪里下载的,版本号是什么。主要还是以来以package.json生成的文件。?

?

最后我们来看看NPM的常用指令——更多指令

?


四、包的使用

要怎么使用我们的包呢?让我们来了解一下。

?最基础的方法就是普通的引入:

?显然这样的方法和我们以前学习的方法没有太大差别,还有什么方法可以使用呢?我们来看这边一个node.js的教程网站的教学来学习吧:

?还有其他的方法教学:nodejs的入门教程


结尾

我们所学习的NPM,更多的是注重于NPM的使用方法,学会使用它,那么查找一些需要使用的包,下载相应的包也就变得更加简单,而且不需要复杂的去管理。博客到这里就结束了,感谢大家观看。

?

  JavaScript知识库 最新文章
ES6的相关知识点
react 函数式组件 & react其他一些总结
Vue基础超详细
前端JS也可以连点成线(Vue中运用 AntVG6)
Vue事件处理的基本使用
Vue后台项目的记录 (一)
前后端分离vue跨域,devServer配置proxy代理
TypeScript
初识vuex
vue项目安装包指令收集
上一篇文章      下一篇文章      查看所有文章
加:2022-03-17 22:02:04  更:2022-03-17 22:04:43 
 
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁

360图书馆 购物 三丰科技 阅读网 日历 万年历 2024年11日历 -2024/11/24 5:30:08-

图片自动播放器
↓图片自动播放器↓
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
图片批量下载器
↓批量下载图片,美女图库↓
  网站联系: qq:121756557 email:121756557@qq.com  IT数码