create-react-app未自动生成package.lock且安装依赖报错如何解决

1. create-react-app未自动生成package-lock.json的原因 #

• 本地npm全局配置关闭了lock文件生成：可执行npm config get package-lock检查配置，如果返回值为false，说明之前手动关闭了lock文件生成，执行npm config set package-lock true即可恢复新建项目时自动生成package-lock.json的逻辑。
• 创建项目时默认使用了yarn作为包管理器：如果本地环境同时安装了yarn，部分版本的create-react-app会优先使用yarn安装依赖，只会生成yarn.lock文件，不会生成npm对应的package-lock.json，后续你手动执行npm install才会生成npm版本的lock文件。
• 手动执行npm install时收到的old lockfile警告属于版本兼容的常规提示，是因为生成lock文件的npm版本和你当前使用的npm版本不匹配，首次安装补充完元数据后，后续执行npm操作就不会再弹出该提示，不影响项目正常运行。

2. 无法正常安装react-particles-js的原因 #

报错核心是对等依赖版本冲突：你当前项目的React版本是17.0.2，而你要安装的react-particles-js@3.5.3官方要求的对等依赖React版本范围是16.x.x，版本范围不匹配。npm v7及以上版本默认会严格校验对等依赖，不符合要求就会直接抛出安装错误。

解决方案 #

• 方案一：安装时添加--legacy-peer-deps参数跳过对等依赖校验，执行命令：
  npm i react-particles-js --legacy-peer-deps
  该包在React17环境下大多可以正常运行，不会出现功能异常。
• 方案二：更换同功能的活跃维护包，react-particles-js已经停更很久，你可以选择适配了更高版本React的粒子效果替代包，避免依赖冲突问题。

内容的提问来源于stack exchange，提问作者Tharindu Gimras