引入antd组件样式_antd组件样式局部加载，用react-app-rewired插件应该怎么配置？...

package.json配置：

{

"name": "hawerblog",

"version": "0.1.0",

"private": true,

"dependencies": {

"antd": "^3.15.0",

"babel-plugin-import": "^1.11.0",

"customize-cra": "^0.2.12",

"less": "^3.9.0",

"less-loader": "^4.1.0",

"react": "^16.8.4",

"react-app-rewire-define-plugin": "^1.0.0",

"react-app-rewire-less": "^2.1.3",

"react-app-rewired": "^2.1.1",

"react-dom": "^16.8.4",

"react-router-dom": "^4.4.0",

"react-scripts": "2.1.8",

"webpack-merge": "^4.2.1"

},

"scripts": {

"start": "set PORT=4000 && react-app-rewired start",

"build": "react-app-rewired build",

"test": "react-app-rewired test",

"eject": "react-scripts eject"

},

"eslintConfig": {

"extends": "react-app"

},

"browserslist": [

">0.2%",

"not dead",

"not ie <= 11",

"not op_mini all"

]

}

想实现的目标效果：

import React, { Component } from 'react'

import 'antd/dist/antd.css'

import { Button } from 'antd'

import { BrowserRouter as Router, Route, Link } from 'react-router-dom'

import './styles/main.less'

import routes from './routers'

import Banner from './components/banner'

class App extends Component {

render () {

return (

<div className='App'>

<Button type='primary'>

Primary

</Button>

<Banner/>

<Router>

<header className='title'>

{routes.map((r, key) => {

if (r.text) {

return <Link key={key} to={r.path}>

{r.text}

</Link>

}

})}

</header>

{routes.map((route, key) => {

if (route.exact) {

return <Route

key={key}

exact

path={route.path}

render={props => (

<route.component {...props} routes={route.routes} />

)} />

}else {

return <Route key={key} path={route.path} render={props => (

<route.component {...props} routes={route.routes} />

)} />

}

})}

</Router>

</div>

)

}

}

export default App

直接引入下面这句，样式就有了，不需要全局引入完整的antd样式，查阅资料我选用的是react-app-rewired方案

import { Button } from ‘antd’

config-overrides.js 配置如下

const {

override,

fixBabelImports,

addLessLoader,

addBabelPlugin

} = require('customize-cra')

const path = require('path')

const merge = require('webpack-merge')

const rewireLess = require('react-app-rewire-less')

const rewireDefinePlugin = require('react-app-rewire-define-plugin')

override(

fixBabelImports('import', {

libraryName: 'antd',

libraryDirectory: 'es',

style: true

}),

addLessLoader({

javascriptEnabled: true,

modifyVars: { '@primary-color': '#1DA57A' }

})

)

module.exports = function override(config, env) {

config.resolve = {

...config.resolve,

alias: { '@': path.resolve(__dirname, 'src') }

}

config.module.rules.push({ test: /\.less$/ }, { test: /\.css$/ })

return config

}

现在是不知道怎么样才能排除对应css/less 的node_modules引用

各位朋友走过路过给个思路谢谢！