npm install —— 从一个简单例子,看本地安装与全局安装的区别

简介:

npm的包安装分为本地安装(local)、全局安装(global)两种,从敲的命令行来看,差别只是有没有-g而已,比如

npm install grunt # 本地安装
npm install -g grunt-cli # 全局安装

这两种安装方式有什么区别呢?从npm官方文档的说明来看,主要区别在于(后面通过具体的例子来说明):
本地安装
1. 将安装包放在 ./node_modules 下(运行npm时所在的目录)
2. 可以通过 require() 来引入本地安装的包

全局安装
1. 将安装包放在 /usr/local 下
2. 可以直接在命令行里使用

本地安装

1、将安装包放在 ./node_modules 下(运行npm时所在的目录)

比如运行下面命令

npm install grunt --save-dev

那么,就会在当前目录下发现一个node_modules目录,进去后能够看到grunt这个包

casperchenMacBookPro:testUsemin casperchen$ ll
total 200
drwxr-xr-x  16 casperchen  staff   544B 12 14 23:17 node_modules

进入node_modules

casperchenMacBookPro:node_modules casperchen$ ll
total 0
drwxr-xr-x  16 casperchen  staff   544B 12  5 00:49 grunt

2、可以通过 require() 来引入本地安装的包

直接来个例子,我们在项目根目录下创建test.js,里面的内容很简单

var grunt = require('grunt');
grunt.log.writeln('hello grunt');

然后在控制台运行test.js

node test.js

然后就会看到如下输出

casperchenMacBookPro:testUsemin casperchen$ node test.js 
hello grunt

全局安装

1、将安装包放在 /usr/local 下

运行如下命令

npm install -g grunt-cli

然后进入/usr/local/bin目录,就会发现grunt-cli已经被放置在下面了

casperchenMacBookPro:bin casperchen$ pwd
/usr/local/bin
casperchenMacBookPro:bin casperchen$ ll grunt
lrwxr-xr-x  1 root  admin    39B  8 18 21:43 grunt -> ../lib/node_modules/grunt-cli/bin/grunt

可见,全局模块的真实安装路径在/usr/local/lib/node_modules/下/usr/local/bin下的可执行文件只是软链接而已

2、可以直接在命令行里使用

实现细节在上面其实就讲到了,通过在`/usr/local/bin下创建软链接的方式实现。这里不赘述

更直观的例子

下面就直接看下,当我们在项目目录下运行grunt task(task为具体的grunt任务名,自行替换)时,发生了什么事情。这里要借助node-inspector

首先,没接触过node-inspector的童鞋可以参考之前的文章了解下

运行如下命令开启调试

node-inspector &

见到如下输出

casperchenMacBookPro:tmp casperchen$ node-inspector &
[1] 14390
casperchenMacBookPro:tmp casperchen$ Node Inspector v0.6.1
   info  - socket.io started
Visit http://127.0.0.1:8080/debug?port=5858 to start debugging.

接着,在当前任务下运行grunt任务

^CcasperchenMacBookPro:testUsemin casperchen$ node --debug-brk $(which grunt) dev
debugger listening on port 5858

接着,打开chrome浏览器,输入网址http://127.0.0.1:8080/debug?port=5858,就会自动进入断点调试状态
。从一旁显示的tips可以看到,全局命令grunt其实就是/usr/local/lib/node_modules/grunt-cli/bin/grunt
image

按下F8接着往下跑,就会进如Gruntfile.js,此时的grunt,是本地安装的一个node包。全局命令跟本地的包名字一样,挺有迷惑性的。
image


相关文章
|
3月前
|
缓存 资源调度 持续交付
在清空NPM缓存后,检查是否所有依赖都已正确安装
在清空NPM缓存后,检查是否所有依赖都已正确安装
|
1月前
|
资源调度 前端开发 JavaScript
React 安装(NPM)
10月更文挑战第6天
59 1
|
1月前
|
缓存 资源调度 持续交付
在清空NPM缓存后,我如何检查是否所有依赖都已正确安装?
【10月更文挑战第5天】在清空NPM缓存后,我如何检查是否所有依赖都已正确安装?
|
27天前
|
缓存 JavaScript 前端开发
拿下奇怪的前端报错(三):npm install卡住了一个钟- 从原理搞定安装的全链路问题
本文详细分析了 `npm install` 过程中可能出现的卡顿问题及解决方法,包括网络问题、Node.js 版本不兼容、缓存问题、权限问题、包冲突、过时的 npm 版本、系统资源不足和脚本问题等,并提供了相应的解决策略。同时,还介绍了开启全部日志、使用替代工具和使用 Docker 提供 Node 环境等其他处理方法。
345 0
9-14|npm install --global windows-build-tools 安装太慢了,能够指定国内源
9-14|npm install --global windows-build-tools 安装太慢了,能够指定国内源
|
2月前
|
缓存 JavaScript 前端开发
8种方法解决vue创建项目报错:command failed: npm install --loglevel error
该文章提供了八种解决Vue项目创建时遇到的`command failed: npm install --loglevel error`错误的方法,包括清理缓存、更换npm源、重新安装Node.js等措施。
8种方法解决vue创建项目报错:command failed: npm install --loglevel error
|
3月前
|
敏捷开发 缓存 前端开发
阿里云云效产品使用合集之前端打包时npm安装卡住一般是什么导致的
云效作为一款全面覆盖研发全生命周期管理的云端效能平台,致力于帮助企业实现高效协同、敏捷研发和持续交付。本合集收集整理了用户在使用云效过程中遇到的常见问题,问题涉及项目创建与管理、需求规划与迭代、代码托管与版本控制、自动化测试、持续集成与发布等方面。
|
3月前
|
缓存 资源调度 持续交付
在清空NPM缓存后,如何检查是否所有依赖都已正确安装
在清空NPM缓存后,如何检查是否所有依赖都已正确安装
|
28天前
|
缓存 资源调度 JavaScript
npx与npm的差异解析,以及包管理器yarn与Node版本管理工具nvm的使用方法详解
npx与npm的差异解析,以及包管理器yarn与Node版本管理工具nvm的使用方法详解
30 0
2071 verbose node v16.6.0 2072 verbose npm v7.19.1或者 no such file or directory, lstat ‘D:\wor
该博客文章提供了解决在使用npm版本7.19.1时出现的"no such file or directory"错误的具体方法,建议通过降级npm到6.14.8版本来解决问题,并确认了该方法可以成功安装node_modules。
2071 verbose node v16.6.0 2072 verbose npm v7.19.1或者 no such file or directory, lstat ‘D:\wor