01.项目目录搭建以及styled-Components和Reser.css的结合使用

1. 首先，我们使用脚手架创建了一个新的项目，这里我们对项目的一些基本文件进行整理，首先将一些不需要的文件删除，删除之后留下一些需要的文件，如下：
   

2. 这里我们将原来的style.css已经重命名为style.js文件。下面安装styled-Components,打开终端，输入命令：yarn add styled-Components,安装完成之后重新启动一下。

3. styled-Components：为了顺应组件化的潮流，人们开始考虑使用JS上编写CSS，styled components就是其中一种解决方案。styled components是一个React第三方库，作用是可以将样式写成组件的形式，实现在JS上编写CSS。

4. 。我们在style.js文件中引入 styled-Components：

import {createGlobalStyle  } from 'styled-components'
createGlobalStyle `
//内容
`;

1. 那么如何在styled-Components中结合reser.css使用，现在所使用的主流浏览器对一些标签的默认属性上并没有做到统一，所以我们偶尔会发现，某个页面在chrome浏览器上很正常，到了firefox上面却有意想不到的偏差。当然编程人员不喜欢这样的兼容性问题的，而reset.css就是解决默认样式不兼容问题的办法之一。
   现在常用的reset书写方式：