总结一下遇到的问题

1. 不知道styles.demo作为className的意思

我们引入jsx对应的scss样式文件的时候这样引入：

import styles from './index.scss';

写类名的时候这样写：

<div className={styles.detail}><div/>

styles就代表这个样式文件，就像是一个对象，获取对象的属性不就是object.***吗。

因此，这样写className是打点调scss文件中的样式，那么直接写className="***"不好吗？

也可以，但是这样像获取对象里面的元素一样写，一定是有好处的，接下来，检查看一下类名是什么样的吧。

例如下面这个：src是我的文件夹名字，pages是src下的文件夹名字，products是pages下面的文件夹名字，detail是这个div的className。

平时我们看到的都是只有一个类名，写什么是什么，这里这样写加上了前缀后缀，这样可以防止类名混乱，出现bug。

2. 给antd走马灯设置的轮播图片，但是不显示

原因是给img设置了absolute，绝对定位，去掉绝对定位即可。

3. react svg图片引入后报错

根据报错信息，下载一个内联加载器：

$ npm install svg-inline-loader react-inlinesvg --save-dev

配置webpack.config.js：

{
    test: /\.svg$/,
    loader: "svg-inline-loader"
}

使用：

import KeyImage from '../img/key.svg'; 
import SVG from 'react-inlinesvg';

<SVG src={KeyImage} />

最后总结一下遇到问题的解决思路：

如果不知道一个地方代码的意思，而这里又是自己任务区间，那就根据这个代码和引入的文件，追根寻源，还是不明白就百度，百度的时候要想清楚再百度，要知道自己需要查找什么。

如果是样式问题就检查，不多赘述。

如果是配置问题，那就想好去哪个地方找问题，然后看是否是属性没有写全，或者是缺少依赖等等，关于依赖可以查看官网，一般官网都会写。

pps：最后，还要注意的是，代码的封装可重用性，要记住懒是第一生产力，能少敲就少敲，能封装就封装。

ppps：还是个初学者，有不对的地方也请指出，谢谢。