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

                }

              )

            },