发布于 2026-01-06 3 阅读
0

使用 pnpm 创建 React 应用

使用 pnpm 创建 React 应用

笔记

React React App (CRA) 已停止开发。您可以CRA官方文档中查看其替代方案,例如 Next.js、Remix 和 Gatsby。您也可以使用 CRAVite来启动 React 项目。


pnpm:快速、节省磁盘空间的软件包管理器

最近,我了解到了 React pnpm,作为一名 React 开发人员,我决定尝试一下 React create-react-app


1. 安装pnpm

npm install -g pnpm
Enter fullscreen mode Exit fullscreen mode

2. 使用create-react-app.创建一个 React 项目

pnpm create react-app pnpm-cra --template typescript
Enter fullscreen mode Exit fullscreen mode

3. 删除node_modulespackage-lock.json

4. 使用以下方式安装软件包pnpm

pnpm install
Enter fullscreen mode Exit fullscreen mode

可能存在如下错误。

hint: If you want peer dependencies to be automatically installed, add "auto-install-peers=true" to an .npmrc file at the root of your project.
hint: If you don't want pnpm to fail on peer dependency issues, add "strict-peer-dependencies=false" to an .npmrc file at the root of your project.
Enter fullscreen mode Exit fullscreen mode

咱们领会一下暗示。

创建文件.npmrc并添加auto-install-peers=true,然后删除node_modules并重新安装软件包pnpm install

5. 运行开发服务器

pnpm start
Enter fullscreen mode Exit fullscreen mode

我的情况是,出现了另一个错误。

Property 'toBeInTheDocument' does not exist on type 'JestMatchers<HTMLElement>'.
Enter fullscreen mode Exit fullscreen mode

我也不清楚具体原因,或许安装一个类型包就能解决这个问题。

pnpm add -D @types/testing-library__jest-dom
Enter fullscreen mode Exit fullscreen mode

然后重新运行开发服务器!


就这样,希望对大家有所帮助。
祝编程愉快!

文章来源:https://dev.to/lico/set-up-create-react-app-using-pnpm-nji