最近上班闲来无事，开始准备学点前端，记录点自己的踩坑经验

一、react 介绍 create-react-app 是 FaceBook 官方发布了一个无需配置的、用于快速构建开发环境的脚手架工具 二、Mac 电脑开发准备 1.安装 node.js 是为了用 npm ，使用安装包即可 2.安装 git ，是为了用 git ，安装 git 过程 （ 1 ）安装 homebrew /bin/zsh -c "$(curl -fsSL https://gitee.com/cunkai/HomebrewCN/raw/master/Homebrew.sh)" （ 2 ）安装成功之后 brew install git （ 3 ）即可使用 git 命令 三、搭建 react 脚手架 1.npm install -g create-react-app 发现报错： [Error: EACCES: permission denied, access '/usr/local/lib/node_modules/npm/node_modules/ansi-regex'] { npm ERR! errno: -13, npm ERR! code: 'EACCES', npm ERR! syscall: 'access', npm ERR! path: '/usr/local/lib/node_modules/npm/node_modules/ansi-regex' 2.搜索 npm install -g create-react-app MacOS 报错解决 sudo npm uninstall -g create-react-app //删除之前对镜像 npm config set registry https://registry.npm.taobao.org // 安装还是不成功直接切换成淘宝镜像安装 npm config get registry sudo npm install -g create-react-app create-react-app --version//查看版本 3.create-react-app react-program//快速生成新项目，react-program 为项目名称， （已经开始报错了，不支持这种安装方式了） 报错如下： You are running create-react-app 4.0.3, which is behind the latest release (5.0.0).

We no longer support global installation of Create React App.

Please remove any global installs with one of the following commands:

• npm uninstall -g create-react-app
• yarn global remove create-react-app

The latest instructions for creating a new app can be found here: https://create-react-app.dev/docs/getting-started/） 4.成功之后出现 Success! Created react-program at /Users/zhangxinzhan/react-program Inside that directory, you can run several commands:

npm start Starts the development server.

npm run build Bundles the app into static files for production.

npm test Starts the test runner.

npm run eject Removes this tool and copies build dependencies, configuration files and scripts into the app directory. If you do this, you can’t go back!

We suggest that you begin by typing:

cd react-program npm start

Happy hacking! 5. 使用命令 cd react-program npm start 6.启动之后就可以看到一个 welcome 页面，然后就可以去 src 下面编辑你自己的 APP 啦 https://www.cnblogs.com/katydids/p/11083096.html 7.引入 antd https://ant-design.gitee.io/docs/react/use-with-create-react-app-cn,不能用 1-6 npm i antd 引入 antd 遇到点问题，得是在 antd 官网介绍的那块引入的 8.引入 router npm install react-router-dom npm i react-router-dom