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

这篇具有很好参考价值的文章主要介绍了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

2023 年前端编程 NodeJs 包管理工具 npm 安装和使用详细介绍,前端JS编程实用方法,前端,npm,arcgis
下载好 Node 后我们就可以使用npm命令进行包的管理,接下来打开终端:

检查Node版本

npm --version
npm -v

npm 版本查询

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

2023 年前端编程 NodeJs 包管理工具 npm 安装和使用详细介绍,前端JS编程实用方法,前端,npm,arcgis

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

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

2023 年前端编程 NodeJs 包管理工具 npm 安装和使用详细介绍,前端JS编程实用方法,前端,npm,arcgis

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

npm 内置包

const path = require('path')

console.log(__dirname);

console.log(path.resolve(__dirname, '../')) 

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); 
})

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)

输出的结果:

2023 年前端编程 NodeJs 包管理工具 npm 安装和使用详细介绍,前端JS编程实用方法,前端,npm,arcgis

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))

测试结果:
2023 年前端编程 NodeJs 包管理工具 npm 安装和使用详细介绍,前端JS编程实用方法,前端,npm,arcgis

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

上传的命令:npm publish

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

npm 脚本

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

$ npm run script1 & npm run script2

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

$ npm run script1 && npm run script2

常用的 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"
  }
}
// wrist.js
console.log(process.env.npm_package_name); // foo
console.log(process.env.npm_package_version); // 1.2.5

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"
}

在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

或者以ssh的方式

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

nrm 镜像源

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

查看当前源

npm config get registry

切换淘宝源

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

安装 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

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

npm install -D mocha

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

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

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

npx mocha --version

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

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

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

npx create-react-app my-react-app

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

注意,只要 npx 后面的模块无法在本地发现,就会下载同名模块。比如,本地没有安装http-server模块,下面的命令会自动下载该模块,在当前目录启动一个 Web 服务。文章来源地址https://www.toymoban.com/news/detail-699441.html

npx http-server

到了这里,关于2023 年前端编程 NodeJs 包管理工具 npm 安装和使用详细介绍的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • Npm 工具完全删除 - 安装 npm多版本管理工具 nvm

    1. windows10完全卸载npm 1. npm多版本管理

    2024年02月16日
    浏览(47)
  • 包管理工具--》npm的配置及使用(二)

     在阅读本篇文章前请先阅读包管理工具--》npm的配置及使用(一) 包管理工具系列文章目录 一、包管理工具--》npm的配置及使用(一) 二、包管理工具--》npm的配置及使用(二)  三、包管理工具--》发布一个自己的npm包 四、包管理工具--》yarn的配置及使用 五、包管理工具

    2024年02月09日
    浏览(79)
  • 包管理工具--》npm的配置及使用(一)

    包管理工具系列文章目录 一、包管理工具--》npm的配置及使用(一) 二、包管理工具--》npm的配置及使用(二)  三、包管理工具--》发布一个自己的npm包 四、包管理工具--》yarn的配置及使用 五、包管理工具--》其他包管理器之cnpm、pnpm、nvm 目录 🌟概念 🌟背景 🌟前端包管

    2024年02月09日
    浏览(37)
  • 【CentOS】【npm】centos安装npm(Nodejs)

    最后面添加: :wq保存,然后运行命令,使得环境变量生效 查看环境变量是否生效 可以用node -v和npm -v来检查下:

    2024年02月14日
    浏览(50)
  • nodejs详细安装步骤和npm配置

    1、Node.js简介 1、Node.js简介 Node.js® 是一个基于 Chrome V8 引擎的 JavaScript 运行时。Node.js 使用高效、轻量级的事件驱动、非阻塞 I/O 模型。它的包生态系统,npm,是目前世界上最大的开源库生态系统。 2、下载Node.js 官方地址:https://nodejs.org/en/ 或 https://nodejs.org/zh-cn/ 如下图: 2、

    2024年02月20日
    浏览(44)
  • Nodejs安装及npm配置(超详细)

    Node.js官网下载地址 Node.js中文下载地址 本文以 node.js 16.14.2 版本做演示,此版本要求操作系统为 win8以上 如操作系统为 win7 ,则可采用 12.18.4 版本( 亲测 )或者采用其它12以下版本皆可 下载完成后,双击运行下安装包,开始安装,一直无脑安装,一直点 next 即可,安装路径

    2024年03月19日
    浏览(57)
  • 查看NodeJS与npm对应版本以及指定安装特定版本的npm(可查)

    官网信息链接:https://nodejs.org/zh-cn/download/releases/ 安装指定版本的npm 1.安装淘宝镜像 即 npm转cnpm 防止npm安装过慢 2.查看当前node版本(我的大版本是16) 3.查看当前npm版本,安装node.js对应版本的npm 3.确认是否安装成功 (打开命令行,然后输入)

    2024年02月17日
    浏览(53)
  • Astro建站教程:安装nodejs,npm下载Astro,安装扩展

    下载Nodejs LTS版:https://nodejs.org/en 安装步骤全默认即可,安装路径可以根据自己的爱好更改 在桌面右键打开cmd或powershell,输入node -v和npm -v测试是否安装成功 浏览器打开https://docs.astro.build/en/install/auto/ 复制里面的 npm create astro@latest 这行代码,在本地的cmd中输入并回车,然后输

    2024年02月09日
    浏览(67)
  • Ubuntu安装最新版本NodeJs和Npm的方法

    以下是 Nodejs 18.x 的安装,一行代码搞定 的意思是前面的命令执行无误后,再执行后面代码 https://github.com/nodesource/distributions NodeSource官方的GitHub,其他版本和系统可自行查阅。 使用 n Node版本管理工具升级到 最新版 源码编译安装花了10多分钟都没编译完,绝对是最坑的方法

    2024年02月19日
    浏览(30)
  • 安装Nodejs、NPM、Vue脚手架详细教程

    查看自己电脑是否安装nodejs 我这里已经下载过了,没有下载过的会提示该命令不存在 可以到官网下载一下 https://nodejs.org/en/download/ 不要安装在中文路径下 如果你安装了nodejs–默认会安装NPM. 使用vue --version 查看当前是否安装vue脚手架 没有安装会提示不是内部命令 在命令行输

    2024年02月16日
    浏览(49)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包