MERN栈安装npx/create-react-app遇权限错误及依赖漏洞问题

所有后续连锁问题都来自两个初始错误操作：

• 用sudo执行npm安装命令，会将家目录下npm缓存、配置文件的所有者改为root，普通用户后续读写相关文件就会触发EACCES权限报错；同时sudo环境和普通用户环境的npm路径、版本配置不一致，极易出现依赖树错乱
• 全局安装create-react-app属于过时操作，React官方早已废弃全局安装CRA的使用方式，旧版本全局CRA自带的依赖树存在大量已知兼容问题和安全提示，后续执行npm audit fix --force会无视语义化版本约束跨大版本升级依赖，直接打破CRA内部锁定的版本兼容关系，最终进入依赖地狱。

1. 清理错乱的全局环境，修复权限问题 #

先彻底清理之前错误安装的残留文件，修复npm目录权限，后续全程不要用sudo执行任何npm相关命令：

# 卸载之前用sudo全局安装的错误包
sudo npm uninstall -g create-react-app npx react react-scripts

# 将npm相关目录的权限改回当前用户
sudo chown -R noah:noah ~/.npm
sudo chown -R noah:noah /home/noah/package-lock.json

# 删除家目录根路径下误生成的依赖残留（之前执行npm install的位置不对才会生成这些文件）
rm -rf /home/noah/node_modules /home/noah/package.json /home/noah/package-lock.json

注意：不要修改/usr、/usr/lib等系统级目录的权限，仅操作用户家目录下的npm相关文件即可，避免破坏系统自带依赖

2. 用官方推荐方式初始化React项目 #

不需要提前全局安装npx、create-react-app，npx是npm 6及以上版本自带的工具，单独安装反而会出现版本冲突：

• 先确认本地环境版本符合要求，CRA要求Node版本 >=14.0.0、npm版本 >=6.14.0，版本不符合先升级Node到长期支持（LTS）版本即可：

node -v
npm -v

• 切换到专门存放项目的目录（不要在家目录根路径直接初始化项目），执行初始化命令：

# 示例：切换到家目录下的projects文件夹，没有的话可以先执行mkdir ~/projects创建
cd ~/projects
# 初始化项目，把my-app替换成你自己的项目名
npx create-react-app my-app

执行完成后进入项目目录执行npm start就能正常启动开发环境，不会出现权限报错和依赖冲突。

3. 安全漏洞提示的处理说明 #

初始化完成后如果npm提示存在少量安全漏洞，不需要强行修复：

• 所有漏洞提示如果来自react-scripts相关依赖，都属于开发环境依赖，不会被打包到线上生产代码，不会对实际项目运行造成安全影响
• 禁止随意执行npm audit fix --force，该参数会无视版本兼容关系强制升级依赖，直接导致CRA项目无法启动。如果需要修复可兼容的漏洞，仅执行不带--force参数的npm audit fix即可，剩余的开发依赖漏洞等待CRA官方更新react-scripts版本后，升级对应依赖版本即可解决。

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