(文中图均来自不同博主,仅通过整理方便自己学习查看记忆)
1.package.json和package-lock.json的区别
- package.json
- name:项目名,也就是在使用npm init 初始化时取的名字,但是如果使用的是npm init -y 快速初始化的话,那这里的名字就是默认存放这个文件的文件名;
- version:版本号;
- private:希不希望授权别人以任何形式使用私有包或未发布的;
- scripts-serve:是vue的项目启动简写配置;
- scripts-build:是vue的打包操作简写配置;
- dependencies:指定了项目运行时所依赖的模块;
- devDependencies:指定项目开发时所需要的模块,也就是在项目开发时才用得上,一旦项目打包上线了,就将移除这里的第三方模块;
- package-lock.json
- package-lock.json是在运行“npm install”时生成的一个文件,用于记录当前状态下项目中实际安装的各个package的版本号、模块下载地址、及这个模块又依赖了哪些依赖。
- 为什么有了package.json,还需要package-lock.json文件呢,当node_modules文件夹并不存在或被删除时,需要用到npm install重新装载全部依赖时,通过package-lock.json可以直接表明下载地址和相关依赖,相对下载速度也更快,也不容易报错。
2.package.json中怎么区分开发依赖和生产依赖?安装包时的-S、-D等参数含义
- dependencies
生产环境依赖,也就是依赖会被打包到web应用中
devDependencies
开发环境依赖,不会被打包,是保证web就用能运行起来的根本
- -S就是–save的简写
- -D就是–save-dev 这样安装的包的名称及版本号就会存在package.json的devDependencies这个里面,而–save会将包的名称及版本号放在dependencies里面。
- 我们在使用npm install 安装模块或插件的时候,有两种命令把他们写入到 package.json 文件里面去,比如:
- –save-dev
- –save
- 在 package.json 文件里面提现出来的区别就是,使用 --save-dev 安装的 插件,被写入到 devDependencies 对象里面去,而使用 --save 安装的插件,责被写入到 dependencies 对象里面去。
- 那 package.json 文件里面的 devDependencies 和 dependencies 对象有什么区别呢?
- devDependencies 里面的插件只用于开发环境,不用于生产环境,而 dependencies 是需要发布到生产环境的。
3.为什么有些包名,以@开头,有些没有?
- 这种包被称为 Scoped Package
- Scope 的定义非常宽泛,一个普通开发者,或者组织都可以定义一个 Scope。
这样带来的好处就是,不用担心自己命名的包名与其他人、组织的包名冲突。
4.package.json包信息版本号如"^10.0.1"、"-10.0.1"、"10.0.1"等方式的区别
- "eslint": "7.5.0" 这里就是下载 7.5.0 版本
- "concurrently": "^5.2.0" 这里就会下载 5.x.x最新版本,简单来说会下载 5开头最新版本,假如有个6.x.x版本出现,不会更新到6.x.x 版本
- babel-loader": "~8.1.0 这里就会下载 8.1.x最新版本,简单来说会下载 8.1.x开头最新版本,假如有个8.2.x版本出现,不会更新到8.2.x 版本
5.如何在项目中限制node的版本号和npm的版本号
前言:很多时候我们的项目换个电脑就语法错误、运行报错、打包失败可能都是因为使用了不同的node版本导致的兼容性问题。package-lock.json 的冲突也有可能是node版本不一致导致的
- 补充( 刘哇勇博主限定node版本)https://www.cnblogs.com/Wayou/p/restrict_node_version.html#:~:text=%E6%A0%B9%E6%8D%AE%20npm-package%20%E6%96%87%E6%A1%A3%E7%9A%84%E6%8F%8F%E8%BF%B0%EF%BC%8C%E5%8F%AF%E4%BB%A5%E5%9C%A8%20package.json%20%E4%B8%AD%E9%80%9A%E8%BF%87%20engines%20%E5%B1%9E%E6%80%A7%E6%8C%87%E5%AE%9A%20Node.js,%E7%9A%84%E7%89%88%E6%9C%AC%EF%BC%9A%20%7B%20%22engines%22%3A%20%7B%20%22npm%22%3A%20%22~1.0.20%22%20%7D%20%7D