Selaa lähdekoodia

fix: 加入css模块化

lanjianrong 4 vuotta sitten
vanhempi
commit
363b32e883

+ 16 - 2
config/webpack.prod.config.js

@@ -22,6 +22,7 @@ module.exports = merge(common, {
       },
       {
         test: /\.less$/,
+        exclude: /\.module\.less$/,
         use: [
           MiniCssExtractPlugin.loader,
           'css-loader',
@@ -29,6 +30,19 @@ module.exports = merge(common, {
         ]
       },
       {
+        test: /\.module\.less$/,
+        use: [
+          'style-loader',
+          {
+            loader: 'css-loader',
+            options: {
+              modules: true
+            }
+          },
+          'less-loader'
+        ]
+      },
+      {
         test: /\.(sass|scss)$/,
         use: [
           MiniCssExtractPlugin.loader,
@@ -104,10 +118,10 @@ module.exports = merge(common, {
           // from: /\/hr/, to: '/hr',
           // from: /\/hr\/indof/, to: '/hr',
           from: '/contact', to: '/contact',
-         
+
           //from: /^\/contact\/company/, to: '/contact',
           //from: /^\/product/, to: '/product',
-          
+
           //from: /^\/product\/lockCount/, to: '/product',
           //from: /product/, to: '/product',
           //from: /product\/lockCount/, to: '/product',

+ 5 - 3
src/common/lockType/index.js

@@ -1,9 +1,9 @@
+import { Input, List, message, Radio } from 'antd';
 import React, { PureComponent } from 'react';
 import { connect } from 'react-redux';
 // import { BrowserRouter, Route,Link } from 'react-router-dom';
 import { actionCreators } from './store';
-import { message,Input,List,Radio} from 'antd';
-import Style from './styles.less';
+import Style from './styles.module.less';
 
 
 const { Search } = Input;
@@ -40,11 +40,13 @@ class lockType extends PureComponent {
             <div>
               {/* <div className="ml-4 mr-4 alert alert-warning">暂时没有搜索的数据</div> */}
               <div className="p-4 border-top d-flex justify-content-center">
-                <Radio.Group className={Style.override_ant_btn} buttonStyle="solid" onChange={(e) => handleChangeLSGraido(e)} value={lead}>
+              <div className={Style.overrideAntBtn}>
+                <Radio.Group buttonStyle="solid" onChange={(e) => handleChangeLSGraido(e)} value={lead}>
                   <Radio.Button value="lead">借出</Radio.Button>
                   <Radio.Button value="sale">销售</Radio.Button>
                   <Radio.Button value="give">赠送</Radio.Button>
                 </Radio.Group>
+              </div>
                 {/* <ul className="nav nav-pills" role="tablist">
                   <li className="nav-item"><a className="nav-link active" data-toggle="tab" href="#">借出</a></li>
                   <li className="nav-item"><a className="nav-link" data-toggle="tab" href="#2">销售</a></li>

+ 0 - 10
src/common/lockType/styles.less

@@ -1,10 +0,0 @@
-.override_ant_btn {  
-    :global {  
-        .ant-radio-button-wrapper-checked {
-            background-color: #886ab5 !important;
-        }
-        .ant-radio-button-checked {
-            border-color: #886ab5 !important;
-        }
-    }  
-} 

+ 8 - 0
src/common/lockType/styles.module.less

@@ -0,0 +1,8 @@
+.overrideAntBtn {
+    :global(ant-radio-button-wrapper-checked) {
+        background-color: #886ab5;
+    }
+    :global(ant-radio-button-checked){
+        border-color: #886ab5;
+    }
+}