• 2023 年前端编程 NodeJs 包管理工具 npm 安装和使用详细介绍


    npm 基本概述

    npm is the world’s largest software registry. Open source developers from every continent use npm to share and borrow packages, and many organizations use npm to manage private development as well.

    npm 官方网站:https://www.npmjs.com

    在这里插入图片描述
    下载好 Node 后我们就可以使用npm命令进行包的管理,接下来打开终端:

    检查Node版本

    npm --version
    npm -v
    
    • 1
    • 2

    npm 版本查询

    1. npm view 包名 versions :查看服务器上包的最新的版本信息
    2. npm ls 包名 -g :查看本地全局安装的包版本
    3. npm info 包名 :查看npm js服务器上包的最新的版本信息,比 npm view pkg version 提供的信息更丰富

    在这里插入图片描述

    版本号:x.x.x
    例如:5.2.3 主版本号 major:5 次版本号 minor:2 补丁号 patch:3
    patch是奇数的话是不稳定的版本,如果是偶数的话则是稳定的版本

    1. npm outdated :查看过期的包信息

    在这里插入图片描述

    ^ x.x.x :锁定主版本号,其他取最新
    ~ x.x.x :锁定主版本和次版本号,其他取最新
    x.x.x :锁定主次补丁版本号

    npm 内置包

    const path = require('path')
    
    console.log(__dirname);
    
    console.log(path.resolve(__dirname, '../')) 
    
    • 1
    • 2
    • 3
    • 4
    • 5

    npm 第三方包

    • -y : 所有的操作提示全部yes
    • -g : 全局进行安装对应的包

    使用 npm 下载第三方包,例如:axios,来请求调用网易接口

    接口地址:https://api.vvhan.com/api/rand.music?type=json&sort=热歌榜

    const axios = require('axios')
    
    axios.get("https://api.vvhan.com/api/rand.music?type=json&sort="+encodeURI("热歌榜"))
    .then(res => {
        console.log(res)
    })
    .catch(err => {
        console.error(err); 
    })
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9

    nodejs 使用 axios 进行http get请求时,报错 TypeError [ERR_UNESCAPED_CHARACTERS]: Request path contains unescaped characters,其出现的原因是请求的 url 中携带中文参数。
    解决方案:“https://api.vvhan.com/api/rand.music?type=json&sort=”+encodeURI(“热歌榜”)

    下载 lodash 第三方包,测试如下:

    const _ = require('lodash')
    
    let arr = [1,2,3,4,5,6]
    
    let double_arr = _.chunk(arr,2)
    
    console.log(double_arr)
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7

    输出的结果:

    在这里插入图片描述

    npm 自定义包

    const _ = require("lodash")
    
    module.exports = function mychunk(arr){
        return _.chunk(arr,2)
    }
    
    // 使用测试
    const mychunk = require('./mychunk')
    
    let test_arr = [2,4,6,8]
    
    console.log(mychunk(test_arr))
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12

    测试结果:
    在这里插入图片描述

    npm 发布自定义包

    查看 npm 源:npm config get registry

    切换 npm 源:npm config set registry http://registry.npmjs.org

    选择 npm 源:nrm use npm

    PS C:\Users\16204\Desktop\Nodejs> npm adduser
    npm notice Log in on https://registry.npmjs.org/
    Username: wristwaking
    Password:
    Email: (this IS public) 1620444902@qq.com
    
    • 1
    • 2
    • 3
    • 4
    • 5

    上传的命令:npm publish

    如果上传失败,检查包的名称,在 package.json 文件中修改 name 属性,原因是你的包名在npm已经存在。

    npm 脚本

    如果是并行执行(即同时的平行执行),可以使用 & 符号。

    $ npm run script1 & npm run script2
    
    • 1

    如果是继发执行(即只有前一个任务成功,才执行下一个任务),可以使用 && 符号。

    $ npm run script1 && npm run script2
    
    • 1

    常用的 npm 脚本简写形式:npm start 是 npm run start

    npm 脚本有一个非常强大的功能,就是可以使用 npm 的内部变量。

    首先,通过 npm_package_ 前缀,npm 脚本可以拿到 package.json 里面的字段。比如,下面是一个 package.json。

    {
      "name": "foo", 
      "version": "1.2.5",
      "scripts": {
        "view": "node wrist.js"
      }
    }
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    // wrist.js
    console.log(process.env.npm_package_name); // foo
    console.log(process.env.npm_package_version); // 1.2.5
    
    • 1
    • 2
    • 3

    npmpackage前缀也支持嵌套的package.json字段。

    上面代码中,我们通过环境变量 process.env 对象,拿到 package.json 的字段值。如果是 Bash 脚本,可以用$npm_package_name 和 $npm_package_version 取到这两个值。

    "repository": {
      "type": "git",
      "url": "xxx"
    },
    scripts: {
      "view": "echo $npm_package_repository_type"
    }
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7

    在window操作系统中:“echo %npm_package_repository_type%”
    在Linux操作系统中:“echo $npm_package_repository_type”

    npm 安装 Git 包

    这样适合安装公司内部的 git 服务器上的项目

    npm install git+https://git@github.com:lurongtao/gp-project.git
    
    • 1

    或者以ssh的方式

    npm install git+ssh://git@github.com:lurongtao/gp-project.git
    
    • 1

    nrm 镜像源

    NRM (npm registry manager)是npm的镜像源管理工具,有时候国外资源太慢,使用这个就可以快速地在 npm 源间切换。

    查看当前源

    npm config get registry
    
    • 1

    切换淘宝源

    npm config set registry https://registry.npm.taobao.org
    
    • 1

    安装 nrm:在命令行执行命令,npm install -g nrm,全局安装nrm
    使用 nrm:执行命令 nrm ls 查看可选的源。 其中,带*的是当前使用的源,上面的输出表明当前源是官方源。
    切换 nrm:如果要切换到taobao源,执行命令nrm use taobao。
    测试速度:你还可以通过 nrm test 测试相应源的响应时间。

    npx 扩展工具

    NPX: npm package extention

    npm 从5.2版开始,增加了 npx 命令。Node 自带 npm 模块,所以可以直接使用 npx 命令。万一不能用,就要手动安装一下。

    主要作用1:调用项目安装的模块

    npx 会自动查找当前依赖包中的可执行文件,如果找不到,就会去 PATH 里找。如果依然找不到,就会帮你安装!

    npm install -g npx
    
    • 1

    npx 想要解决的主要问题,就是调用项目内部安装的模块。比如,项目内部安装了Mocha。

    npm install -D mocha
    
    • 1

    一般来说,调用 Mocha ,只能在项目脚本和 package.json 的scripts字段里面,如果想在命令行下调用,必须像下面这样。

    # 项目的根目录下执行
    node-modules/.bin/mocha --version
    
    • 1
    • 2

    npx 就是想解决这个问题,让项目内部安装的模块用起来更方便,只要像下面这样调用就行了。

    npx mocha --version
    
    • 1

    npx 的原理很简单,就是运行的时候,会到node_modules/.bin路径和环境变量$PATH里面,检查命令是否存在。

    主要作用2:避免全局安装模块

    除了调用项目内部模块,npx 还能避免全局安装的模块。比如,create-react-app 这个模块是全局安装,npx 可以运行它,而且不进行全局安装。

    npx create-react-app my-react-app
    
    • 1

    上面代码运行时,npx 将 create-react-app 下载到一个临时目录,使用以后再删除。所以,以后再次执行上面的命令,会重新下载 create-react-app。

    注意,只要 npx 后面的模块无法在本地发现,就会下载同名模块。比如,本地没有安装http-server模块,下面的命令会自动下载该模块,在当前目录启动一个 Web 服务。

    npx http-server
    
    • 1
  • 相关阅读:
    研发质量管理体系
    【MySQL】DML
    1-Pytorch初始化张量和张量的类型
    选择需求管理工具
    linux环境部署
    对数据库进行增删改查操作
    Centos如何安装Mysql
    基于多特征融合的活动识别算法
    信管知识梳理(三)软件工程相关知识
    需求文档中的“项目前景与范围”
  • 原文地址:https://blog.csdn.net/qq_47452807/article/details/132740924