新建一個(gè)react項(xiàng)目
- 全局安裝
npm install -g create-react-app
- 新建并對(duì)react項(xiàng)目進(jìn)行命名(注:項(xiàng)目名稱不能有大寫)
create-react-app reactproject
- 通過(guò)命令進(jìn)入文件夾內(nèi)部搂捧,打開編輯器,準(zhǔn)備運(yùn)行項(xiàng)目
cd reactproject code .
- 運(yùn)行項(xiàng)目
npm start 或者 yarn start
- 新建一個(gè)用ts開發(fā)的react項(xiàng)目
yarn create react-app react-ts --template=typescript
暴露webpack的配置文件
暴露config
npm run eject
如果報(bào)錯(cuò):Remove untracked files, stash or commit any changes, and try again.
原因是:使用腳手架創(chuàng)建一個(gè)項(xiàng)目的時(shí)候懂缕,自動(dòng)增加了一個(gè).gitignore文件允跑,而我們本地卻沒有文件倉(cāng)庫(kù)。
解決辦法:暫存代碼,再執(zhí)行 npm run eject
git add . git commit -m 'init' npm run eject
項(xiàng)目中使用sass - 配置
webpack 已經(jīng)配置好sass了 搪柑,但是還是需要安裝一下node-sass,然后重啟,就可以使用sass開發(fā)了
npm install node-sass
react router
yarn add react-router-dom // 安裝
- react hooks 中的路由跳轉(zhuǎn)
import { useHistory } from "react-router-dom";
function HomeButton() {
let history = useHistory();
return (
<button type="button" onClick={()=> history.push("/home")}>
home
</button>
);
}
- BrowserRouter和HashRouter的區(qū)別
redux
yarn add redux react-redux react-thunk // 安裝
axios
yarn add axios // 安裝