关于react-cli 项目 在eject 之后如何配置less文件的问题

首先eject ， 

尝试跑一下 会发现报没有安装bable-loader的错误； 那么安装bable-loader；

安装less，less-loader 

发现主目录下 config下会有三个webpack的文件； dev开发 prod生产 base公共

测试和 生产 这俩文件同时修改：

在module 项中找到rules 规则 里； 找到css 文件解释器的那段 ，拷贝一份，粘到下面 ；

{
                test: /\.less$/,
                use: [
                    require.resolve('style-loader'),
                    {
                        loader: require.resolve('css-loader'),
                        options: {
                            importLoaders: 1,
                        },
                    },
                    {
                        loader: require.resolve('postcss-loader'),
                        options: {
                            // Necessary for external CSS imports to work
                            // https://github.com/facebookincubator/create-react-app/issues/2677
                            ident: 'postcss',
                            plugins: () => [
                                require('postcss-flexbugs-fixes'),
                                autoprefixer({
                                    browsers: [
                                        '>1%',
                                        'last 4 versions',
                                        'Firefox ESR',
                                        'not ie < 9', // React doesn't support IE8 anyway
                                    ],
                                    flexbox: 'no-2009',
                                }),
                            ],
                        },
                    },
                    {
                      loader:require.resolve('less-loader')
                    }
                ],
            },

在use数组中最后的 loader 中加上一个 loader ：

{
                        loader:require.resolve('less-loader')
                    }

上面代码的意思 就是 以 .xxx的文件解析的规则； 也有另外连缀一种写法比较简单，这里会比较复杂点展开了配置项； 

use 里的所有loader 就是 使用顺序 倒着来的； 以我们的例子：

use:[style-loader,css-loader, postcss-loader,lessloader ];

实际的顺序是这样的 ；

1， 使用less-loader 处理less文件

2， 使用postcss-loader文件处理 css浏览器兼容问题

3， 使用css-loader 转成 css 

3，使用style-loader 填充到行内；