安装

yarn add -g create-react-app

创建

create-react-app <project-name>  // --template typescript  使用 Typescript

使用 normalize.css

• 作用：它让不同的浏览器在渲染网页元素的时候形式更统一，而不是重置默认样式

  @import-normalize

  使用 scss 语法

• 安装 dart-sassjavascript yarn add node-sass@npm:dart-sass

引用根目录文件

使用 @import 语法引用 scss

@import 'xxx/xxx.js'  // 默认为根目录

• 将 src 标记为根目录，消除 ide 报错

使用 import 语法引用 js 或 ts

• 配置

  // jsconfig.json 或tsconfig.json
  {
  "compilerOptions": {"baseUrl": "src"},
   "include": [ "src" ]
  }

  使用 style-components 插件

  react-router-dom

  安装

  yarn add react-router-dom
  yarn add @types/react-router-dom   // TS 类型声明文件

  使用

  ```javascript import {HashRouter as Router, Switch, Route, Redirect} from ‘react-router-dom’;

const App = () => { return (

<a name="Xp4tt"></a>
### NavLink 标签
<a name="OMW5W"></a>
#### 作用：当前页面被选中时会自动加上设置的类型名
<a name="YOYvQ"></a>
#### 属性：activeClassName
<a name="Pou0g"></a>
#### 示例
```javascript
<NavLink activeClassName='active' to='/'>记账</Link>