react 引用less module 修改webpack 配置

用法 ：

import styles  from './App.less'

<span className={styles.right}>

 

一、 首先提取webpack 配置

create-react-app创建的react项目，webapck配置，默认情况下是在node_modules里面的，我们需要把它暴露到根目录上来。

执行 npm run eject 命令即可，一般情况下，是会报错的。

解决方法，依次执行下面几个命令就可以了。

git init

git add . 注意后面这里有个点

git commit -m 'init'

这时，重新执行一下 npm run eject即可。

二、修改 config>>webpack.config.js

const lessModuleRegex = /\.module\.less$/;

三、

     exclude: lessModuleRegex,

  

  {

              test: lessModuleRegex,

              include: paths.appSrc,

              loader: getStyleLoaders(

                {

                  importLoaders: 2,

                  sourceMap: shouldUseSourceMap,

                  modules: {

                    getLocalIdent: getCSSModuleLocalIdent

                  }

                },

                'less-loader',

                {

                  javascriptEnabled: true

                }

              )

            },