深入了解Npm
liuian 2025-01-05 18:42 33 浏览
1、npm 是什么?
- npm(node package manager):node.js 的包管理器,用于node插件管理(包括安装、卸载、管理依赖等) ,npm 是随同 node.js 一起安装的包管理工具,能解决 node.js 代码部署上的很多问题,常见的使用场景有以下几种:
- 允许用户从 npm 服务器下载别人编写的第三方包到本地使用。
- 允许用户从 npm 服务器下载并安装别人编写的命令行程序到本地使用。
- 允许用户将自己编写的包或命令行程序上传到 npm 服务器供别人使用。
- npm是一个包管理器,它让 javascript 开发者分享、复用代码更方便.在程序开发中我们常常需要依赖别人提供的框架,写js 也不例外。这些可以重复的框架代码被称作包(package)或者模块(module),一个包可以是一个文件夹里放着几个文件,同时有一个叫做 package.json的文件.
- 一个网站里通常有几十甚至上百个package,分散在各处,通常会将这些包按照各自的功能进行划分(类似安卓开发中的划分子模块),但是如果重复造一些轮子,不如上传到一个公共平台,让更多的人一起使用、参与这个特定功能的模块。而npm 的作用就是让我们发布、下载一些JS轮子更加方便。
- 可以去官方网站:https://www.npmjs.com/,浏览、搜索想要的轮子,也可以直接在命令行中 search一下。
- 如:npm中搜索 jQuery
- 使用npm后可以非常方便地查看依赖的轮子是否有更新、是否需要下载新版本。现在知道npm是干什么的了。当人们说起“npm”时,可能在说三个东西: 1.一个网站,就是前面提到用于搜索JS模块的网站:https://www.npmjs.com/ 2.一个仓库,保存着人们分享的JS模块的大数据库 3.命令行里的客户端,开发者使用它来管理、安装、发布模块
2、安装 npm
- 安装 node.js 的时候会相应地安装 npm,node.js 已经集成了 npm,所以安装 node.js 后 npm 也安装好了。
- 下载官网:https://nodejs.org/en/
- 中文学习node API 文档:http://nodejs.cn/
- 查看本地 node 和 npm 是否安装成功
3、更新 npm
npm 更新的可比 node勤快多了,因此你下载的node附带的 npm 版本可能不是最新的,你可以使用如下命令下载最新 npm:
npm install npm@latest -g 相当于npm install xxx@最新版 -全局
或
npm install -g npm
其中install不用介绍了,就是安装,后面的
npm@latest
就是@的格式,@后面加上版本号。在下载其他模块时也是这个格式。
-g
代表全局安装。
4、package.json 文件介绍
- npm 的全称:Node Package Manager,中文意思:node包管理器。
- 管理本地安装npm包的最好方式就是创建package.json文件。一个 package.json文件可以有以下几点作用:
- 作为一个描述文件,描述了你的项目依赖哪些包
- 允许使用“语义化版本规则”(后面介绍)指明你项目依赖包的版本
- 让你的构建更好地与其他开发者分享,便于重复使用
- 案例:在新建的空文件夹中 npm 下载 jQuery 包
npm install jquery
而 jQuery 就在 node_module 文件夹下:
5、package.json 如何创建
使用 npm init 即可在当前目录创建一个 package.json 文件:
- 输入npm init后会弹出一堆问题,可以输入对应内容,也可以使用默认值。在回答一堆问题后输入yes 就会生成图中所示内容的 package.json文件。
- 如果嫌回答这一大堆问题麻烦,可以直接输入npm init --yes 跳过回答问题步骤,直接生成默认值的 package.json 文件:
6、package.json 的内容
- package.json文件至少要有两部分内容:
- “name”:全部小写,没有空格,可以使用下划线或者横线
- “version”: x.x.x 的格式,符合 “语义化版本规则”
- 如:
"name": "demo-package","version": "1.0.0",
案例:在一个空文件夹下初始化创建 package.json
这些默认生成的都可以去修改
其他内容:
- description:描述信息,有助于搜索
- main:入口文件,一般都是 index.js
- scripts:支持的脚本,默认是一个空的 test
- keywords:关键字,有助于在人们使用 npm search搜索时发现你的项目author :作者信息
- license :默认是 MIT
- bugs:当前项目的一些错误信息,如果有的话
- 可以为init命令设置一些默认值,比如:
> npm set init.author.email "xxx@gmail.com"> npm set init.author.name "xdr630"> npm set init.license "MIT"
scripts 案例详解:把上面初始化的 package.json 做如下修改
执行
npm run abc
查看
7、dependencies(生产环境)和 devDependencies(开发环境)的区别
- 就是在项目的开发阶段就是开发环境;项目上线了,开始正式提供对外服务,上线后的阶段就是生产环境。 在生产环境下,一般会关掉错误报告,打开错误日志等操作。
- devDependencies 配置的是开发环境,安装项目开发时所依赖的模块。比如像webpack工具,只是用来构建项目和打包,这些都是在开发阶段才使用的,等项目上线后就用不到webpack工具了,那么就可以把webpack安装到开发环境中,使用 --save-dev 命令安装到devdependencies下,命令语法:
npm install --save-dev packageName# 简写npm i -D packageName
dependencies配置的是生产环境,安装项目运行时所依赖的模块。比如jQuery库,等项目上线以后依然是要继续使用的,我们就要安装在生产环境中,如果没有把需要的依赖安装到生产环境中,项目上线运行时就有可能会报错。使用 --save 命令安装到 dependencies 下,命令语法:
npm install --save packageName# 简写npm i -S packageName
总结
- 使用npm安装依赖时,–save和–save-dev
- 使用–save安装的依赖,会被写到dependencies区块里面去。
- 而使用–save-dev安装依赖,则会被写到devDependencies区块里面去
- 什么都不写,只是本地安装,并非全局。这时候会被写到dependencies区块里面去。
- 在package.json 文件中dependencies和devDependencies的区别
- devDependencies 里面的依赖只用于开发环境,不用于生产环境。而 dependencies 依赖的包不仅开发环境能使用,生产环境也能使用。
- 两种环境的的指定方式是通过配置文件中的NODE_ENV=developement或NODE_ENV=production来指定是开发还是生产环境的。
- 使用的一些构建工具例如glup、webpack这些只是在开发中使用的包,上线以后就和他们没关系了,所以将它写入devDependencies
- 上一篇:ESLint 9.0大版本发布,配置文件大更新
- 下一篇:vue3项目创建并运行
相关推荐
- Docker 47 个常见故障的原因和解决方法
-
【作者】曹如熙,具有超过十年的互联网运维及五年以上团队管理经验,多年容器云的运维,尤其在Docker和kubernetes领域非常精通。Docker是一种相对使用较简单的容器,我们可以通过以下几种方式...
- 电脑30个快问快答,解决常见电脑问题
-
1.强行关机/停电对电脑有影响吗?答:可能损坏硬盘(机械硬盘风险高)、未保存数据丢失,偶尔一次影响小,但频繁操作会缩短硬件寿命。2.C盘满影响速度吗?答:会!系统运行需C盘空间缓存临时数据,空间不...
- 使用Tcpdump包抓取分析数据包的详细用法
-
TcpDump可以将网络中传送的数据包的“头”完全截获下来提供分析。它支持针对网络层、协议、主机、网络或端口的过滤,并提供and、or、not等逻辑语句来帮助你去掉无用的信息。tcpdump就是一种...
- 电脑启动不了(BootDevice Not Found Hard Disk-3F0)解决方案
-
HP品牌机,开机启动不了,黑屏,开机取下主板电池恢复BIOS后,开机显示找不到启动盘。一、按F2键进入BIOS,出现硬盘内存检测界面的话,直接退出。就会出现这个界面,光标键向下,选择BIOSSetu...
- 电脑开机黑屏别慌!快码住!起底维修老师傅不能说的秘密
-
按下开机键却只收获黑屏大礼包?那些神秘的英文提示、刺耳的蜂鸣声,其实是电脑在给你发送求救信号!从按下电源到进入桌面的12秒里,你的电脑经历了史诗级的硬件自检与系统加载,今天我们就破译这段“摩斯电码”。...
- 电脑启动故障为何总要先看BIOS?新手必读的关键知识解析
-
最近在帮朋友们解答电脑无法正常开机的问题时,发现大家经常收到一句高频建议:“先检查BIOS”。对不少普通用户而言,BIOS依然是个神秘的存在。那么,BIOS到底是什么?电脑出现哪些故障会与它相关呢?本...
- Windows 11 KB5053598更新:安全补丁还是系统噩梦?
-
2025年3月11日,微软发布了Windows1124H2的强制性更新KB5053598,作为“周二补丁日”(PatchTuesday)的一部分。然而,这款本应提升系统安全性的更新却引发了广泛的...
- 飞牛OS入门安装遇到问题,如何解决?
-
之前小编尝试了用旧电脑装飞牛OS安装之前特意查了一些硬件要求飞牛OS目前支持主流的x86架构硬件主机需能连网线飞牛OS暂时不支持只有无线网卡的安装貌似很多小伙伴在一开始安装就卡住了那今天咱们汇总分...
- 几种常见的电脑开机黑屏显示白色英文字母解决方法
-
当电脑开机出现黑屏并显示白色英文字母时,通常表示系统启动过程中遇到了错误。以下是几种常见原因及对应的解决方法,按照排查顺序整理:一、检查外接设备与硬件连接可能原因:外接U盘、移动硬盘等未拔出,或内部硬...
- 电脑启动出现问题,为什么都要先检查BIOS?
-
【ZOL中关村在线原创技巧应用】最近在回答问题的时候,总会发现很多朋友都在问“电脑无法正常开机怎么办?”这样类似的问题,而许多DIY大佬的回复总会出现一条高频建议“先检查BIOS”。但对于许多普通用户...
- 教你怎么用JavaScript检测当前浏览器是无头浏览器
-
什么是无头浏览器(headlessbrowser)?无头浏览器是指可以在图形界面情况下运行的浏览器。我可以通过编程来控制无头浏览器自动执行各种任务,比如做测试,给网页截屏等。为什么叫“无头”浏览器?...
- 12个高效的Python爬虫框架,你用过几个?
-
实现爬虫技术的编程环境有很多种,Java、Python、C++等都可以用来爬虫。但很多人选择Python来写爬虫,为什么呢?因为Python确实很适合做爬虫,丰富的第三方库十分强大,简单几行代码便可实...
- 运维的报表之路,用 node.js 轻松发送 grafana 报表
-
在运维过程中,无论是监控还是报表,都会有一些通过邮件发送图表的需求,由于开源的zabbix,grafana和kibana等并不完全具有“想发送哪儿就发送哪儿”的图片生成功能,在grafana...
- C#基于浏览器内核的高级爬虫(c#爬取网页内容)
-
基于C#.NET+PhantomJS+Sellenium的高级网络爬虫程序。可执行Javascript代码、触发各类事件、操纵页面Dom结构、甚至可以移除不喜欢的CSS样式。很多网站都用Ajax动态加...
- 如何优化一个秒杀项目?(秒杀实现思路)
-
问题1:使用jmeter性能压测,定位瓶颈代码步骤流程:线程组--->Http请求--->查看结果树--->聚合报告tips:host的文件--->优先调用映射,减少DNS的时...
- 一周热门
-
-
Python实现人事自动打卡,再也不会被批评
-
Psutil + Flask + Pyecharts + Bootstrap 开发动态可视化系统监控
-
一个解决支持HTML/CSS/JS网页转PDF(高质量)的终极解决方案
-
【验证码逆向专栏】vaptcha 手势验证码逆向分析
-
再见Swagger UI 国人开源了一款超好用的 API 文档生成框架,真香
-
网页转成pdf文件的经验分享 网页转成pdf文件的经验分享怎么弄
-
C++ std::vector 简介
-
python使用fitz模块提取pdf中的图片
-
《人人译客》如何规划你的移动电商网站(2)
-
Jupyterhub安装教程 jupyter怎么安装包
-
- 最近发表
- 标签列表
-
- python判断字典是否为空 (50)
- crontab每周一执行 (48)
- aes和des区别 (43)
- bash脚本和shell脚本的区别 (35)
- canvas库 (33)
- dataframe筛选满足条件的行 (35)
- gitlab日志 (33)
- lua xpcall (36)
- blob转json (33)
- python判断是否在列表中 (34)
- python html转pdf (36)
- 安装指定版本npm (37)
- idea搜索jar包内容 (33)
- css鼠标悬停出现隐藏的文字 (34)
- linux nacos启动命令 (33)
- gitlab 日志 (36)
- adb pull (37)
- table.render (33)
- uniapp textarea (33)
- python判断元素在不在列表里 (34)
- python 字典删除元素 (34)
- react-admin (33)
- vscode切换git分支 (35)
- vscode美化代码 (33)
- python bytes转16进制 (35)