diff --git a/src/components/SettingDrawer/index.js b/src/components/SettingDrawer/index.js
index 47e1b6c452ea0435e86c0a39aa653a064b051985..fb299e01f1cfc131817b918d21bd763cf6359485 100644
--- a/src/components/SettingDrawer/index.js
+++ b/src/components/SettingDrawer/index.js
@@ -1,5 +1,5 @@
 import React, { PureComponent } from 'react';
-import { Select, message, Drawer, List, Switch, Divider, Icon, Button } from 'antd';
+import { Select, message, Drawer, List, Switch, Divider, Icon, Button, Alert } from 'antd';
 import { formatMessage } from 'umi/locale';
 import { CopyToClipboard } from 'react-copy-to-clipboard';
 import { connect } from 'dva';
@@ -215,18 +215,15 @@ class SettingDrawer extends PureComponent {
             text={JSON.stringify(setting)}
             onCopy={() => message.success(formatMessage({ id: 'app.setting.copyinfo' }))}
           >
-            <Button
-              style={{
-                width: 224,
-              }}
-            >
-              <Icon type="copy" />
+            <Button block icon="copy">
               {formatMessage({ id: 'app.setting.copy' })}
             </Button>
           </CopyToClipboard>
-          <div className={styles.productionHint}>
-            {formatMessage({ id: 'app.setting.production.hint' })}
-          </div>
+          <Alert
+            type="warning"
+            className={styles.productionHint}
+            message={formatMessage({ id: 'app.setting.production.hint' })}
+          />
         </div>
       </Drawer>
     );
diff --git a/src/components/SettingDrawer/index.less b/src/components/SettingDrawer/index.less
index 4c7a735ca378d3883a23cb5ee9376809c60fafcd..1731d490f5bce47b64821f1118f9bb41ee70d9e9 100644
--- a/src/components/SettingDrawer/index.less
+++ b/src/components/SettingDrawer/index.less
@@ -71,5 +71,5 @@
 .productionHint {
   font-size: 12px;
   color: @text-color-secondary;
-  margin-top: 8px;
+  margin-top: 16px;
 }
diff --git a/src/layouts/BasicLayout.js b/src/layouts/BasicLayout.js
index ed4b09b0d9ee0b1eac640468802cbe4b0df00765..148092c90b18df79caebb19a11acd81b6c62491a 100644
--- a/src/layouts/BasicLayout.js
+++ b/src/layouts/BasicLayout.js
@@ -202,7 +202,9 @@ class BasicLayout extends React.PureComponent {
             )}
           </ContainerQuery>
         </DocumentTitle>
-        {this.state.rendering ? null : <SettingDrawer />}
+        {this.state.rendering && process.env.NODE_ENV === 'production' ? null : ( // Do show SettingDrawer in production
+          <SettingDrawer />
+        )}
       </React.Fragment>
     );
   }
diff --git a/src/locales/zh-CN.js b/src/locales/zh-CN.js
index 05107549cda08b8ae28c6ae67900b6b34e8fb57a..6f680b279a6e83826990ef6133d8f5d608e6029b 100644
--- a/src/locales/zh-CN.js
+++ b/src/locales/zh-CN.js
@@ -162,6 +162,6 @@ export default {
   'app.setting.othersettings': '其他设置',
   'app.setting.weakmode': '色弱模式',
   'app.setting.copy': '拷贝设置',
-  'app.setting.copyinfo': '拷贝成功，请到 src/defaultSetting.js 中替换',
-  'app.setting.production.hint': '设置侧边栏只会出现在开发环境，请手动配置 src/defaultSetting.js',
+  'app.setting.copyinfo': '拷贝成功，请到 src/defaultSetting.js 中替换默认配置',
+  'app.setting.production.hint': '设置栏只用于开发环境预览，请拷贝后手动修改 src/defaultSetting.js',
 };
diff --git a/src/models/setting.js b/src/models/setting.js
index 6f65cc039e5d2408ac14762e6d12a201f07db875..26b7c8764e7ff2cebf9dc5464c897f1388d87b21 100644
--- a/src/models/setting.js
+++ b/src/models/setting.js
@@ -3,6 +3,10 @@ import defaultSetting from '../defaultSetting';
 
 let lessNodesAppended;
 const updateTheme = primaryColor => {
+  // Don't compile less in production!
+  if (process.env.NODE_ENV === 'production') {
+    return;
+  }
   // Determine if the component is remounted
   if (!primaryColor) {
     return;