❤️《大前端—NPM包管理器》

╰+攻爆jí腚メ 2023-10-02 09:38 111阅读 0赞

## 《大前端—NPM包管理器》 ##

### 1、简介 ###

官方网站：https://www.npmjs.com/  
NPM全称Node Package Manager，是Node.js包管理工具，是全球最大的模块生态系统，里面所有的模块都是开源免费的；也是Node.js的包管理工具，相当于前端的Maven 。

#在命令提示符输入 npm -v 可查看当前npm版本
    npm -v

### 2、使用npm管理项目 ###

1、创建文件夹npm

2、项目初始化

#建立一个空文件夹，在命令提示符进入该文件夹  执行命令初始化
    npm init
    #按照提示输入相关信息，如果是用默认值则直接回车即可。
    #name: 项目名称
    #version: 项目版本号
    #description: 项目描述
    #keywords: {Array}关键词，便于用户搜索到我们的项目
    #最后会生成package.json文件，这个是包的配置文件，相当于maven的pom.xml
    #我们之后也可以根据需要进行修改。
    
    {
      "name": "npm",项目名称
      "version": "1.0.1",  项目版本号
      "description": "我是一个node工程",: 项目描述
      "main": "index.js", 入口js
      "scripts": {  运行脚本
        "test": "echo \"Error: no test specified\" && exit 1"
      },
      "author": "kk",  开发者
      "license": "ISC" 授权协议
    }

![img][]

![img][img 1]

![img][img 2]

#如果想直接生成 package.json 文件，那么可以使用命令
    npm init -y

![img][img 2]

### 3、快速安装和依赖第三方模块 ###

#使用 npm install 安装依赖包的最新版，
    #模块安装的位置：项目目录\node_modules
    #安装会自动在项目目录下添加 package-lock.json文件，这个文件帮助锁定安装包的版本
    #同时package.json 文件中，依赖包会被添加到dependencies节点下，类似maven中的 <dependencies>
    npm install mysql
    npm install mysql@2.1.x#如果安装时想指定特定的版本
    
    #devDependencies节点：开发时的依赖包，项目打包到生产环境的时候不包含的依赖
    #使用 -D参数将依赖添加到devDependencies节点
    npm install --save-dev eslint
    #或
    npm install -D eslint
    
    #全局安装
    #Node.js全局安装的npm包和工具的位置：用户目录\AppData\Roaming\npm\node_modules
    #一些命令行工具常使用全局安装的方式
    npm install -g webpack
    #npm管理的项目在备份和传输的时候一般不携带node_modules文件夹
    npm install #根据package.json中的配置下载依赖，初始化项目

![img][img 3]

**导入模块**

![img][img 4]

终止命令行：Ctrl+c

模块和package-lock.json有什么关系呢？

"dependencies": {
        
       "mysql": "^2.18.1",
       "redis": "^3.1.2"
     }

通过nmp stall xx 会记录在package-lock.json这个文件中

![img][img 5]

就类似于maven中pom.xml一个含义， 记录作用：复用

第一步：找到目标文件夹，找到package.json

![img][img 6]

第二步：将package.json复制到新建项目中

![img][img 7]

第三步：在这个新建项目中执行命令指示符，输入cmd

![img][img 8]

第四步：输入npm install

![img][img 9]

复用完毕

### 4、如果下载过慢怎么办？修改npm镜像 ###

1、修改npm镜像

1.  NPM官方的管理的包都是从 [http://npmjs.com下载的，但是这个网站在国内速度很慢。][http_npmjs.com]
2.  这里推荐使用淘宝 NPM 镜像 http://npm.taobao.org/
3.  淘宝 NPM 镜像是一个完整 npmjs.com 镜像，同步频率目前为 10分钟一次，以保证尽量与官方服务同步。

2、设置镜像地址

#经过下面的配置，以后所有的 npm install 都会经过淘宝的镜像地址下载
    npm install -g cnpm --registry=https://registry.npm.taobao.org 
    #查看npm配置信息
    cnpm -v

3、安装好镜像之后，若想要安装npm，则使用cnpm install xxx即可

下载多个 cnpm install jquery vue redis mysql…

### 卸载模块 ###

npm uninstall mysql ..

3、安装好镜像之后，若想要安装npm，则使用cnpm install xxx即可

下载多个 cnpm install jquery vue redis mysql…

### 卸载模块 ###

npm uninstall mysql ..

[img]: https://img-blog.csdnimg.cn/img_convert/a1ed7233e3da65a3f05549d5a686224e.png
[img 1]: https://img-blog.csdnimg.cn/img_convert/1bce2cd0bbbf35ba7e5d300fb9ecd1f0.png
[img 2]: https://img-blog.csdnimg.cn/img_convert/ad61cdb5130a2407e5d0821912e37f47.png
[img 3]: https://img-blog.csdnimg.cn/img_convert/b712d77f5fcfad52a5ff832f152a4481.png
[img 4]: https://img-blog.csdnimg.cn/img_convert/4abe9accd5ada07deb8f3cb7dabbbd5b.png
[img 5]: https://img-blog.csdnimg.cn/img_convert/99fb3a008aade3e4895c823b15f39e36.png
[img 6]: https://img-blog.csdnimg.cn/img_convert/50252b8428d3164a8fe28e8ecb29f69b.png
[img 7]: https://img-blog.csdnimg.cn/img_convert/45c95e2c9acdfbb675b3b49a4b56bfaf.png
[img 8]: https://img-blog.csdnimg.cn/img_convert/85cce4016238003d455f81ef9fb2485f.png
[img 9]: https://img-blog.csdnimg.cn/img_convert/b7f118567bf7001a05158fa0e32b807d.png
[http_npmjs.com]: http://npmjs.xn--com%2C-794fngl0fq9g8opjmak71erncc6ioqt1y1ddrow2r8u2ecpbg0b./