mirror/ant-design
1
0
Fork 0
mirror of https://github.com/ant-design/ant-design.git synced 2024-11-24 19:19:57 +08:00
Code Issues Actions 31 Packages Projects Releases Wiki Activity

Add postcss solution, improve wording

Browse Source
This commit is contained in:
Arnaud Benhamdine 2018-08-28 15:40:09 +02:00 committed by 偏右
parent 10c866d10c
commit 43d623ca56
1 changed files with 7 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
docs/react/customize-theme.en-US.md
View File

@ -101,11 +101,11 @@ Note: This way will load the styles of all components, regardless of your demand
## How to avoid modifying global styles ?
Currently ant-design modify is designed as a whole experience and modify global styles (eg `body` etc).
If you need to integrate ant-design as a part of a website, perhaps you would want to prevent ant-design to override global styles.
If you need to integrate ant-design as a part of an existing website, it's likely you would want to prevent ant-design to override global styles.
While there's no canonical way to do it, you can take one of the following paths :
### Configuring webpack to scope less files
### Configure webpack to load an alternale less file and scope global styles
It's possible to configure webpack to load an alternate less file:
@ -117,7 +117,11 @@ Where the src/myStylesReplacement.less file loads the same files as the index.le
#antd { @import '~antd/lib/style/core/index.less'; @import '~antd/lib/style/themes/default.less'; }
```
The result is that all of the "global" styles are being applied with the #antd scope:
The result is that all of the "global" styles are being applied with the #antd scope.
### Use a postcss processor to scope all styles
See eg https://gist.github.com/sbusch/a90eafaf5a5b61c6d6172da6ff76ddaa
## Not working?