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

2022-08-22 09:41:49 +08:00
 610639622

一、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:

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

1623 次点击
所在节点    前端开发
4 条回复
murmur
2022-08-22 09:44:24 +08:00
我推荐你用 vue 学起,至少不至于把踩坑的部分单独写出来记录一下,看大家的经验,css 比 js 更难一点
hay313955795
2022-08-22 09:51:05 +08:00
@murmur css 确实是个难题....写了不生效 就很尴尬..调试也调试不出来..
lifesimple
2022-08-22 10:24:43 +08:00
@hay313955795 css 为啥不能调试出来呢 直接 f12 找到元素调试呀
foufoufm
2022-08-27 12:30:52 +08:00
@murmur 想问下 VUE 上手有传送门吗

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/874450

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX