npm工具

        今天想要介绍一个好用的工具,在这个工具之前,我们想要用各种包需要去各个官网上扒下库包文件,然后再导入使用。当我们需要的文件越来越多时,找包就成了一件很麻烦的事儿。于是,npm工具就闪亮登场啦~解决了这一大难题。

目录

一、什么是npm

二、npm的安装

三、npm的常用命令

        创建package.js

        安装模块 

        npm的常用命令 


一、什么是npm

        npm(Node Package Manager)意思是 node 的包管理器,它是随着 Node.js 安装时一起被安装的;无论是在前端还是在前端开发中都会使用到 npm 包管理器。

二、npm的安装

        npm是和Node.js一起发布的,只要安装了Node.js,npm也安装好了。

        官网地址:Download | Node.js

        安装好后,使用如下命令查看安装是否成功。

npm工具_第1张图片

        但是由于npm自身的更新频率比Node.js高很多,所以通过上面的命令安装的npm可能不是最新版本,可以通过下面的命令单独更新npm。

$ npm install npm@latest -g

npm工具_第2张图片

         这样就单独更新好了npm。

三、npm的常用命令

        package.js,让共同开发的同事,知道该项目用了哪些包,具体包的版本信息。   一个基本的package.json文件至少需要包含两个重要信息: 包名name版本信息version

        创建package.js

        进入目录,在当前目录下打开 cmd 命令窗口,执行 npm init 命令,点击回车之后会让你输入一些关于本项目的一些基本信息(可忽略,一直回车直到初始化完成后即可)。

  主要字段的含义如下:

  • name: 模块名, 模块的名称有如下要求:

    • 全部小写
    • 只能是一个词语,没有空格
    • 允许使用破折号和下划线作为单词分隔符
  • version: 模块版本信息

  • description:关于模块功能的简单描述,如果这个字段为空的话,默认会从当前目录的READMD.mdREADME文件读取第一行内容作为它的默认值。

  • main: 模块被引入后,首先加载的文件,默认为index.js

  • scripts: 定义一些常用命令入口

  • npm工具_第3张图片

        初始化完成之后,文件目录下会生成 一个 package.json 文件,说明项目初始化完成;

npm工具_第4张图片

        安装模块 

        初始化完成之后可以进行模块的安装(以安装jQuery为例)

npm install jquery

        下载完成后没在node_modules文件下就可以看到jQuery下载成功了。

npm工具_第5张图片

        使用npm install会读取 package.json文件来安装模块。安装的模块分为两类:deppendencies和devDpendencies,分别对应生产环境需要的安装包和开发环境需要的安装包。同样在安装模块的时候,可以通过指定参数来修改package.json文件,将新安装的模块信息记录到package.json文件。

npm install  --save

npm install  --save-dev

        npm的常用命令 

命令 描述
npm -v 查看版本
npm install  使用npm命令安装模块
npm list  查看所有全局安装的模块
npm list  vue 查看某个模块的版本号
npm uninstall /npm remove 卸载包
npm info 查看包的详细信息
npm install [email protected] 下载指定版本的包
npm install -save moduleName -save 表示 在 package.json 文件中的dependencies节点写入依赖
npm install -save-dev moduleName  -save-dev在package.json文件中的devDependencies节点写入依赖
npm root -g 查看全局安装包的存放位置
npm audit fix 包的修复 ,一般是包的更新
npm ls jquery 查看当前安装包的版本
npm config set registry https://registry.npm.taobao.org  更改 npm 的下载镜像为淘宝镜像

         其实对于npm工具,我们只要记住常用的命令,帮助我们在开发中提高效率就好啦!

npm工具_第6张图片

你可能感兴趣的:(tips,npm,前端,node.js)