React起项目
背景:自己第一次接触REACT,第一次自己起项目,遇到种种困难,由于之前写代码没有考虑过项目架构的问题,这次起项目思考了很多,记录一下。
这里介绍一下快速搭建REACT项目
重点写在前面,安装的时候一定要用yarn,自己用npm装了一晚上一直报错,换了yarn就好了
首先,vscode安装关于react的插件,快捷键可以快速生成代码
其次推荐我们使用create-react-app起项目(建议把官网都看一遍,看看应该使用什么技术搭配)
1.快速生成项目骨架
npx create-react-app my-app
cd my-app
npm start
2.https://www.html.cn/create-react-app/docs/setting-up-your-editor/
安装ESLint插件, 然后,将名为 .eslintrc.json 的文件添加到项目根目录
{
"extends": "react-app"
}
3.自动格式化代码npm install --save husky lint-staged prettier
然后执行以下代码格式化当前的代码./node_modules/.bin/prettier --single-quote --write "src/**/*.{js,jsx,ts,tsx,json,css,scss,md}"
4.安装sass
yarn add node-sass
或者 npm i node-sass --save
5.安装router
yarn add react-router-dom
或者
npm install --save react-router-dom
6.https://ant.design/docs/react/use-with-create-react-app-cn 按照文档逐个安装
7.发现react项目写绝对路径不能获取,在根目录下新建jsconfig.json文件
{
"compilerOptions": {
"baseUrl": "src"
},
"include": ["src"]
}