李恒道 发表于 2022-8-23 23:47:01

[油猴脚本开发指南]npm介绍

# 简介
在之前的介绍中我们已经安装了nodejs
而npm是伴随着nodejs一起安装的包管理工具
你可以在cmd中输入npm -v来查看当前的npm版本
npm -v
8.5.5
包管理工具是什么?
当然是管理包的了
我们可以将一个项目视为一个包
同时可以对该项目安装/删除/使用其他的包
我们来了解一下如何安装吧
# 初始化项目
在任意一个目录(推荐为英文)
打开cmd,输入npm init
填入对应的信息
就会在目录下生成一个package.json文件
如果你不想填入对应信息,则可以使用npm init -y(注意要是英文目录)
![图片.png](data/attachment/forum/202208/23/232717ci6iicdri96joa2r.png)
我们查看一下package.json的文件内容
```
{
"name": "pack",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
},
"author": "",
"license": "ISC"
}
```
name代表输入的包名
version代表版本
description代表描述
main代表我们该包的入口文件,如果使用require会自动引入该文件
在其他需要寻找主文件的时候通常也会通过package.json进行查找
scripts代表npm脚本,后续我们会教大家怎么写简单的脚本命令
author是作者名
license是开源许可
那么我们就了解了基础的包的相关信息以及如何创建一个项目
接下来我们来看一下其他的命令
# 包管理命令
## 修改为国内淘宝源
因为不明原因导致世界线扭曲,所以需要修改源为国内淘宝源才可以正常使用
npm config set registry https://registry.npm.taobao.org
修改后查看是否修改成功
npm config get registry
如果想重置为官方源输入
npm config set registry https://registry.npmjs.org/
## 安装模块
我们使用npm i xxx来安装一个包
但是npm i xxx分为两种
npm install <模块名> --save
npm install <模块名> --save-dev
PS:你也可以将install简写成i,如npm i xxx --save
两者的区别就是会在安装包后
将包放在dependencies或devDependencies目录
--save会放在dependencies
--save-dev会放在devDependencies
dependencies表示是生产环境下也需要的依赖
devDependencies表示仅在开发环境下需要的依赖
如Jquery,在我们编译后的代码也需要,所以属于生产依赖
而代码风格校验工具等,在我们开发的时候才需要,在编译就不需要了,所以属于开发依赖
实际情况下即使你写错了大部分情况还是没什么问题了
但是推荐你严格按照标准来进行遵守
因为在你从github/npm来查找库的时候
会直接提供给你安装命令语句,直接赋值粘贴即可
### 安装特定版本模块
在包名后加@版本号即可

npm install jquert@0.01 --save
这样
## 卸载模块
输入
npm uninstall <模块名>
npm uninstall <模块名> --save
PS:你也可以将uninstall 简写成un,如npm un xxx --save
## 如何传递给他人项目
我们现在的目录是
![图片.png](data/attachment/forum/202208/23/234132eezge3ggzei1isng.png)
仅需要Ctrl+A全选文件,然后不勾选node_modules库
打包文件,发给其他人就好了
node_modules是用来存放包管理工具下载的项目依赖的包的文件夹位置
实际的代码内容是根据你的操作系统等等因素有所改变的,所以不要打包给其他人
## 他人项目我如何来使用
上面叙述的内容
当其他人给你这种文件后
你直接在cmd中输入npm i即可拿到代码正常使用
## 关于包的一点其他提示
注意如果出现各种各样的灵异问题
先去查看官方的包的版本以及你的版本
确保安装的各种依赖版本正确
比如A是0.0.1 你在使用一段时间后
又需要安装A的增强插件B
但是B随着官方更新可能已经到了99.0.0
此时A跟B的版本差异极大
此时需要卸载,按你的需求重新安装对应的版本
我不止一次踩这个坑了...

王一之 发表于 2022-8-24 09:35:35

快要成前端开发指南了{:4_86:}

李恒道 发表于 2022-8-24 11:15:58

王一之 发表于 2022-8-24 09:35
快要成前端开发指南了

我前阵子脑子里也吐槽了这个问题...
都开始准备配上webpack了

王一之 发表于 2022-8-24 13:42:50

李恒道 发表于 2022-8-24 11:15
我前阵子脑子里也吐槽了这个问题...
都开始准备配上webpack了

感觉没必要这么深了。。。提供一个脚手架就行了

李恒道 发表于 2022-8-24 14:10:08

王一之 发表于 2022-8-24 13:42
感觉没必要这么深了。。。提供一个脚手架就行了
要讲webpack分析...
我是想一边教正向搭建一边解读webpack的编译代码
提供一个解决方案

王一之 发表于 2022-8-24 15:02:42

李恒道 发表于 2022-8-24 14:10
要讲webpack分析...
我是想一边教正向搭建一边解读webpack的编译代码
提供一个解决方案


ggnb!
页: [1]
查看完整版本: [油猴脚本开发指南]npm介绍