diff --git a/src/base/0.base.js b/src/base/0.base.js
index 1100c0709..3d342a8d3 100644
--- a/src/base/0.base.js
+++ b/src/base/0.base.js
@@ -1,9 +1,45 @@
-BI.Resizers = new BI.ResizeController();
-BI.Layers = new BI.LayerController();
-BI.Maskers = new BI.MaskersController();
-BI.Bubbles = new BI.BubblesController();
-BI.Tooltips = new BI.TooltipsController();
-BI.Popovers = new BI.PopoverController();
-BI.Drawers = new BI.DrawerController();
-BI.Broadcasts = new BI.BroadcastController();
-BI.StyleLoaders = new BI.StyleLoaderManager();
+import {
+    BroadcastController,
+    BubblesController,
+    DrawerController,
+    LayerController,
+    MaskersController,
+    PopoverController,
+    ResizeController,
+    TooltipsController,
+    StyleLoaderManager
+} from "../core";
+
+const Resizers = new ResizeController();
+const Layers = new LayerController();
+const Maskers = new MaskersController();
+const Bubbles = new BubblesController();
+const Tooltips = new TooltipsController();
+const Popovers = new PopoverController();
+const Drawers = new DrawerController();
+const Broadcasts = new BroadcastController();
+const StyleLoaders = new StyleLoaderManager();
+
+BI.extend(BI, {
+    Resizers,
+    Layers,
+    Maskers,
+    Bubbles,
+    Tooltips,
+    Popovers,
+    Drawers,
+    Broadcasts,
+    StyleLoaders
+});
+
+export {     
+    Resizers,
+    Layers,
+    Maskers,
+    Bubbles,
+    Tooltips,
+    Popovers,
+    Drawers,
+    Broadcasts,
+    StyleLoaders
+};
diff --git a/src/base/index.js b/src/base/index.js
index c10043847..b3a77f840 100644
--- a/src/base/index.js
+++ b/src/base/index.js
@@ -1,9 +1,15 @@
 import Pane from "./1.pane";
+import Single from "./single/0.single";
+import Text from "./single/1.text";
 
 BI.extend(BI, {
     Pane,
+    Single,
+    Text,
 });
 
 export {
     Pane,
+    Single,
+    Text,
 }
\ No newline at end of file
diff --git a/src/base/single/0.single.js b/src/base/single/0.single.js
index c13e02e81..845e8c33d 100644
--- a/src/base/single/0.single.js
+++ b/src/base/single/0.single.js
@@ -10,11 +10,15 @@
  * @abstract
  */
 
-var delayingTooltips;
+import { Widget, shortcut } from "../../core";
+import { Tooltips } from "../0.base";
 
-BI.Single = BI.inherit(BI.Widget, {
-    _defaultConfig: function () {
-        var conf = BI.Single.superclass._defaultConfig.apply(this, arguments);
+@shortcut()
+export default class Single extends Widget {
+    static xtype = "bi.single";
+    
+    _defaultConfig() {
+        const conf = super._defaultConfig(arguments);
 
         return BI.extend(conf, {
             readonly: false,
@@ -24,13 +28,22 @@ BI.Single = BI.inherit(BI.Widget, {
             belowMouse: false, //  title是否跟随鼠标
             enableHover: false,
         });
-    },
+    }
 
-    _showToolTip: function (e, opt) {
+    _showToolTip(e, opt) {
         opt || (opt = {});
-        var self = this;
-        var o = this.options;
-        var title = this.getTitle();
+        const { action } = this.options;
+        const title = this.getTitle();
+
+        const showToolTip = (tooltipOpt) => {
+            if (BI.isKey(tooltipOpt.text) && !Tooltips.has(this.getName())) {
+                Tooltips.show(e, this.getName(), tooltipOpt, this, opt);
+                if (action) {
+                    BI.Actions.runAction(action, "hover", this.options, this);
+                }
+                BI.Actions.runGlobalAction("hover", this.options, this);
+            }
+        }
 
         if (title instanceof Promise) {
             this.requestingTitle = title;
@@ -42,47 +55,37 @@ BI.Single = BI.inherit(BI.Widget, {
             showToolTip(this._getTooltipOptions(title));
         }
 
-        function showToolTip(tooltipOpt) {
-            if (BI.isKey(tooltipOpt.text) && !BI.Tooltips.has(self.getName())) {
-                BI.Tooltips.show(e, self.getName(), tooltipOpt, self, opt);
-                if (o.action) {
-                    BI.Actions.runAction(o.action, "hover", o, self);
-                }
-                BI.Actions.runGlobalAction("hover", o, self);
-            }
-        }
-    },
+    }
 
-    _hideTooltip: function () {
-        var self = this;
-        var tooltip = BI.Tooltips.get(this.getName());
+    _hideTooltip() {
+        const tooltip = Tooltips.get(this.getName());
         if (BI.isNotNull(tooltip)) {
-            tooltip.element.fadeOut(200, function () {
-                BI.Tooltips.remove(self.getName());
+            tooltip.element.fadeOut(200, () => {
+                Tooltips.remove(this.getName());
             });
         }
-    },
-
-    _init: function () {
-        var self = this, o = this.options;
-        o.value = BI.isFunction(o.value) ? this.__watch(o.value, function (context, newValue) {
-            self.setValue(newValue);
-        }) : o.value;
-        BI.Single.superclass._init.apply(this, arguments);
-    },
-
-    _mounted: function () {
-        var o = this.options;
-        if (o.enableHover || BI.isKey(o.title) || BI.isKey(o.warningTitle)
-            || BI.isFunction(o.title) || BI.isFunction(o.warningTitle)) {
+    }
+
+    _init() {
+        const { value } = this.options;
+        this.options.value = BI.isFunction(value) ? this.__watch(value, (context, newValue) => {
+            this.setValue(newValue);
+        }) : value;
+        super._init(arguments);
+    }
+
+    _mounted() {
+        const { enableHover, title, warningTitle, belowMouse, container } = this.options;
+        if (enableHover || BI.isKey(title) || BI.isKey(warningTitle)
+            || BI.isFunction(title) || BI.isFunction(warningTitle)) {
             this.enableHover({
-                belowMouse: o.belowMouse,
-                container: o.container,
+                belowMouse,
+                container,
             });
         }
-    },
+    }
 
-    _clearTimeOut: function () {
+    _clearTimeOut() {
         if (BI.isNotNull(this.showTimeout)) {
             clearTimeout(this.showTimeout);
             this.showTimeout = null;
@@ -91,88 +94,88 @@ BI.Single = BI.inherit(BI.Widget, {
             clearTimeout(this.hideTimeout);
             this.hideTimeout = null;
         }
-    },
+    }
 
-    _getTooltipOptions: function (title) {
-        var o = this.options;
-        var tooltipOpt = {};
+    _getTooltipOptions(title) {
+        const { tipType } = this.options;
+        let tooltipOpt = {};
         if (BI.isPlainObject(title)) {
             tooltipOpt = title;
         } else {
             tooltipOpt.level = this.getTipType() || "success";
             //  由于以前的用法,存在大量disabled:true搭配warningTitle的情况,所以这里做一个兼容,disabled:true的情况下,依然优先显示warningTitle,避免只设置了warningTitle而没有设置title的情况
-            if (BI.isNull(o.tipType) && !this.isEnabled()) {
+            if (BI.isNull(tipType) && !this.isEnabled()) {
                 tooltipOpt.text = (this.getWarningTitle() || title);
             } else {
                 tooltipOpt.text = tooltipOpt.level === "success" ? title : (this.getWarningTitle() || title);
             }
         }
         return tooltipOpt;
-    },
+    }
 
-    enableHover: function (opt) {
+    enableHover(opt) {
         opt || (opt = {});
-        var self = this;
+        let delayingTooltips;
         if (!this._hoverBinded) {
-            this.element.unbind("mouseenter.title").on("mouseenter.title", function (e) {
-                self._e = e;
-                self.mouseOver = true;
-                if (self.getTipType() === "warning" || (BI.isKey(self.getWarningTitle()) && !self.isEnabled())) {
-                    delayingTooltips = self.getName();
-                    self.showTimeout = BI.delay(function () {
-                        if (BI.isNotNull(self.showTimeout) && delayingTooltips === self.getName()) {
-                            self._showToolTip(self._e || e, opt);
+            this.element.unbind("mouseenter.title").on("mouseenter.title", (e) => {
+                this._e = e;
+                this.mouseOver = true;
+                if (this.getTipType() === "warning" || (BI.isKey(this.getWarningTitle()) && !this.isEnabled())) {
+                    delayingTooltips = this.getName();
+                    this.showTimeout = BI.delay(() => {
+                        if (BI.isNotNull(this.showTimeout) && delayingTooltips === this.getName()) {
+                            this._showToolTip(this._e || e, opt);
                         }
                     }, 200);
-                } else if (self.getTipType() === "success" || self.isEnabled()) {
-                    delayingTooltips = self.getName();
-                    self.showTimeout = BI.delay(function () {
-                        if (BI.isNotNull(self.showTimeout) && delayingTooltips === self.getName()) {
-                            self._showToolTip(self._e || e, opt);
+                } else if (this.getTipType() === "success" || this.isEnabled()) {
+                    delayingTooltips = this.getName();
+                    this.showTimeout = BI.delay(() => {
+                        if (BI.isNotNull(this.showTimeout) && delayingTooltips === this.getName()) {
+                            this._showToolTip(this._e || e, opt);
                         }
                     }, 500);
                 }
             });
-            this.element.unbind("mousemove.title").on("mousemove.title", function (e) {
-                self._e = e;
-                if (BI.isNotNull(self.showTimeout)) {
-                    clearTimeout(self.showTimeout);
-                    self.showTimeout = null;
+            this.element.unbind("mousemove.title").on("mousemove.title", (e) => {
+                this._e = e;
+                if (BI.isNotNull(this.showTimeout)) {
+                    clearTimeout(this.showTimeout);
+                    this.showTimeout = null;
                 }
-                if (BI.isNull(self.hideTimeout)) {
-                    self.hideTimeout = BI.delay(function () {
-                        if (BI.isNotNull(self.hideTimeout)) {
-                            self._hideTooltip();
+                if (BI.isNull(this.hideTimeout)) {
+                    this.hideTimeout = BI.delay(() => {
+                        if (BI.isNotNull(this.hideTimeout)) {
+                            this._hideTooltip();
                         }
                     }, 500);
                 }
 
-                self.showTimeout = BI.delay(function () {
+                this.showTimeout = BI.delay(() => {
                     // DEC-5321 IE下如果回调已经进入事件队列，clearTimeout将不会起作用
-                    if (BI.isNotNull(self.showTimeout)) {
-                        if (BI.isNotNull(self.hideTimeout)) {
-                            clearTimeout(self.hideTimeout);
-                            self.hideTimeout = null;
+                    if (BI.isNotNull(this.showTimeout)) {
+                        if (BI.isNotNull(this.hideTimeout)) {
+                            clearTimeout(this.hideTimeout);
+                            this.hideTimeout = null;
                         }
                         // CHART-10611 在拖拽的情况下, 鼠标拖拽着元素离开了拖拽元素的容器，但是子元素在dom结构上仍然属于容器
                         // 这样会认为鼠标仍然在容器中, 500ms内放开的话，会在容器之外显示鼠标停留处显示容器的title
-                        if (self.element.__isMouseInBounds__(self._e || e)) {
-                            self._showToolTip(self._e || e, opt);
+                        if (this.element.__isMouseInBounds__(this._e || e)) {
+                            this._showToolTip(this._e || e, opt);
                         }
                     }
                 }, 500);
             });
-            this.element.unbind("mouseleave.title").on("mouseleave.title", function (e) {
-                self._e = null;
-                self.mouseOver = false;
-                self._clearTimeOut();
-                self._hideTooltip();
+            this.element.unbind("mouseleave.title").on("mouseleave.title", (e) => {
+                this._e = null;
+                this.mouseOver = false;
+                this._clearTimeOut();
+                this._hideTooltip();
             });
             this._hoverBinded = true;
         }
-    },
+    }
 
-    disabledHover: function () {
+    disabledHover() {
         // 取消hover事件
         this._clearTimeOut();
         this._hideTooltip();
@@ -180,74 +183,73 @@ BI.Single = BI.inherit(BI.Widget, {
             .unbind("mousemove.title")
             .unbind("mouseleave.title");
         this._hoverBinded = false;
-    },
+    }
 
     // opt: {container: '', belowMouse: false}
-    setTitle: function (title, opt) {
+    setTitle(title, opt) {
         this.options.title = title;
         if (BI.isKey(title) || BI.isFunction(title)) {
             this.enableHover(opt);
         } else {
             this.disabledHover();
         }
-    },
+    }
 
-    setWarningTitle: function (title, opt) {
+    setWarningTitle(title, opt) {
         this.options.warningTitle = title;
         if (BI.isKey(title) || BI.isFunction(title)) {
             this.enableHover(opt);
         } else {
             this.disabledHover();
         }
-    },
+    }
 
-    setTipType: function (type) {
+    setTipType(type) {
         this.options.tipType = type;
-    },
+    }
 
-    getTipType: function () {
+    getTipType() {
         return this.options.tipType;
-    },
+    }
 
-    isReadOnly: function () {
+    isReadOnly() {
         return !!this.options.readonly;
-    },
+    }
 
-    getTitle: function () {
-        var title = this.options.title;
+    getTitle() {
+        const title = this.options.title;
         if (BI.isFunction(title)) {
             return title();
         }
 
         return title;
-    },
+    }
 
-    getWarningTitle: function () {
-        var title = this.options.warningTitle;
+    getWarningTitle() {
+        const title = this.options.warningTitle;
         if (BI.isFunction(title)) {
             return title();
         }
 
         return title;
-    },
+    }
 
-    setValue: function (val) {
+    setValue(val) {
         if (!this.options.readonly) {
             this.options.value = val;
             this.options.setValue && this.options.setValue(val);
         }
-    },
+    }
 
-    getValue: function () {
+    getValue() {
         return this.options.value;
-    },
+    }
 
-    _destroyed: function () {
+    _destroyed() {
         if (BI.isNotNull(this.showTimeout)) {
             clearTimeout(this.showTimeout);
             this.showTimeout = null;
         }
-        BI.Tooltips.remove(this.getName());
-    },
-});
-BI.shortcut("bi.single", BI.Single);
+        Tooltips.remove(this.getName());
+    }
+}
diff --git a/src/base/single/1.text.js b/src/base/single/1.text.js
index f31ebfe43..33001a7bd 100644
--- a/src/base/single/1.text.js
+++ b/src/base/single/1.text.js
@@ -3,172 +3,174 @@
  * @class BI.Text
  * @extends BI.Single
  */
-!(function () {
-    BI.Text = BI.inherit(BI.Single, {
-
-        props: {
-            baseCls: "bi-text",
-            textAlign: "left",
-            whiteSpace: "normal",
-            lineHeight: null,
-            handler: null, // 如果传入handler,表示处理文字的点击事件，不是区域的
-            hgap: 0,
-            vgap: 0,
-            lgap: 0,
-            rgap: 0,
-            tgap: 0,
-            bgap: 0,
-            py: "",
-            highLight: false,
-        },
-
-        render: function () {
-            var self = this, o = this.options;
-            if (o.hgap + o.lgap > 0) {
-                this.element.css({
-                    "padding-left": BI.pixFormat(o.hgap + o.lgap),
-                });
-            }
-            if (o.hgap + o.rgap > 0) {
-                this.element.css({
-                    "padding-right": BI.pixFormat(o.hgap + o.rgap),
-                });
-            }
-            if (o.vgap + o.tgap > 0) {
-                this.element.css({
-                    "padding-top": BI.pixFormat(o.vgap + o.tgap),
-                });
-            }
-            if (o.vgap + o.bgap > 0) {
-                this.element.css({
-                    "padding-bottom": BI.pixFormat(o.vgap + o.bgap),
-                });
-            }
-            if (BI.isWidthOrHeight(o.height)) {
-                this.element.css({ lineHeight: BI.pixFormat(o.height) });
-            }
-            if (BI.isWidthOrHeight(o.lineHeight)) {
-                this.element.css({ lineHeight: BI.pixFormat(o.lineHeight) });
-            }
-            if (BI.isWidthOrHeight(o.maxWidth)) {
-                this.element.css({ maxWidth: BI.pixFormat(o.maxWidth) });
-            }
+import { shortcut } from "../../core/decorator";
+import { Single } from "../index";
+
+@shortcut()
+export default class Text extends Single {
+    static xtype = "bi.text";
+
+    props = {
+        baseCls: "bi-text",
+        textAlign: "left",
+        whiteSpace: "normal",
+        lineHeight: null,
+        handler: null, // 如果传入handler,表示处理文字的点击事件，不是区域的
+        hgap: 0,
+        vgap: 0,
+        lgap: 0,
+        rgap: 0,
+        tgap: 0,
+        bgap: 0,
+        py: "",
+        highLight: false,
+    }
+
+    render() {
+        const { vgap, hgap, lgap, rgap, tgap, bgap, height, lineHeight, maxWidth, textAlign, whiteSpace, handler, disabled, invalid, text: optionsText, value, keyword, highLight } = this.options;
+        if (hgap + lgap > 0) {
             this.element.css({
-                textAlign: o.textAlign,
-                whiteSpace: this._getTextWrap(),
-                textOverflow: o.whiteSpace === "nowrap" ? "ellipsis" : "",
-                overflow: o.whiteSpace === "nowrap" ? "" : (BI.isWidthOrHeight(o.height) ? "auto" : ""),
+                "padding-left": BI.pixFormat(hgap + lgap),
             });
-            if (o.handler && o.handler !== BI.emptyFn) {
-                this.text = BI.createWidget({
-                    type: "bi.layout",
-                    tagName: "span",
-                });
-                this.text.element.click(function (e) {
-                    !o.disabled && !o.invalid && o.handler.call(self, self.getValue(), self, e);
-                });
-                BI.createWidget({
-                    type: "bi.default",
-                    element: this,
-                    items: [this.text],
-                });
-            } else {
-                this.text = this;
-            }
-
-            var text = BI.isFunction(o.text) ? this.__watch(o.text, function (context, newValue) {
-                self.setText(newValue);
-            }) : o.text;
-            // 只要不是undefined就可以显示text值，否则显示value
-            if (!BI.isUndefined(text)) {
-                this.setText(text);
-            } else if (BI.isKey(o.value)) {
-                this.setText(o.value);
-            }
-            if (BI.isKey(o.keyword)) {
-                this.doRedMark(o.keyword);
-            }
-            if (o.highLight) {
-                this.doHighLight();
-            }
-        },
-
-        _getTextWrap: function () {
-            var o = this.options;
-            switch (o.whiteSpace) {
-                case "nowrap":
-                    return "pre";
-                case "normal":
-                    return "pre-wrap";
-                default:
-                    return o.whiteSpace;
-            }
-        },
-
-        _getShowText: function () {
-            var o = this.options;
-            var text = BI.isFunction(o.text) ? o.text() : o.text;
-
-            return BI.isKey(text) ? BI.Text.formatText(text + "") : text;
-        },
-
-        _doRedMark: function (keyword) {
-            var o = this.options;
-            // render之后做的doRedMark,这个时候虽然标红了，但是之后text mounted执行的时候并没有keyword
-            o.keyword = keyword;
-            this.text.element.__textKeywordMarked__(this._getShowText(), keyword, o.py);
-        },
-
-        doRedMark: function (keyword) {
-            if (BI.isKey(keyword)) {
-                this._doRedMark(keyword);
-            }
-        },
-
-        unRedMark: function () {
-            var o = this.options;
-            o.keyword = "";
-            this.text.element.__textKeywordMarked__(this._getShowText(), "", o.py);
-        },
-
-        doHighLight: function () {
-            this.text.element.addClass("bi-high-light");
-        },
-
-        unHighLight: function () {
-            this.text.element.removeClass("bi-high-light");
-        },
-
-        setValue: function (text) {
-            BI.Text.superclass.setValue.apply(this, arguments);
-            if (!this.isReadOnly()) {
-                this.setText(text);
-            }
-        },
-
-        setStyle: function (css) {
-            this.text.element.css(css);
-        },
-
-        setText: function (text) {
-            BI.Text.superclass.setText.apply(this, arguments);
-            this.options.text = text;
-            this._doRedMark(this.options.keyword);
-        },
-    });
-    var formatters = [];
-    BI.Text.addTextFormatter = function (formatter) {
-        formatters.push(formatter);
-    };
-    BI.Text.formatText = function (text) {
-        if (formatters.length > 0) {
-            for (var i = 0, len = formatters.length; i < len; i++) {
-                text = formatters[i](text);
-            }
         }
+        if (hgap + rgap > 0) {
+            this.element.css({
+                "padding-right": BI.pixFormat(hgap + rgap),
+            });
+        }
+        if (vgap + tgap > 0) {
+            this.element.css({
+                "padding-top": BI.pixFormat(vgap + tgap),
+            });
+        }
+        if (vgap + bgap > 0) {
+            this.element.css({
+                "padding-bottom": BI.pixFormat(vgap + bgap),
+            });
+        }
+        if (BI.isWidthOrHeight(height)) {
+            this.element.css({ lineHeight: BI.pixFormat(height) });
+        }
+        if (BI.isWidthOrHeight(lineHeight)) {
+            this.element.css({ lineHeight: BI.pixFormat(lineHeight) });
+        }
+        if (BI.isWidthOrHeight(maxWidth)) {
+            this.element.css({ maxWidth: BI.pixFormat(maxWidth) });
+        }
+        this.element.css({
+            textAlign: textAlign,
+            whiteSpace: this._getTextWrap(),
+            textOverflow: whiteSpace === "nowrap" ? "ellipsis" : "",
+            overflow: whiteSpace === "nowrap" ? "" : (BI.isWidthOrHeight(height) ? "auto" : ""),
+        });
+        if (handler && handler !== BI.emptyFn) {
+            this.text = BI.createWidget({
+                type: "bi.layout",
+                tagName: "span",
+            });
+            this.text.element.click((e) => { 
+                !disabled && !invalid && handler.call(this, this.getValue(), this, e);
+            });
+            BI.createWidget({
+                type: "bi.default",
+                element: this,
+                items: [this.text],
+            });
+        } else {
+            this.text = this;
+        }
+
+        const text = BI.isFunction(optionsText) ? this.__watch(optionsText, (context, newValue) => {
+            this.setText(newValue);
+        }) : optionsText;
+        // 只要不是undefined就可以显示text值，否则显示value
+        if (!BI.isUndefined(text)) {
+            this.setText(text);
+        } else if (BI.isKey(value)) {
+            this.setText(value);
+        }
+        if (BI.isKey(keyword)) {
+            this.doRedMark(keyword);
+        }
+        if (highLight) {
+            this.doHighLight();
+        }
+    }
+
+    _getTextWrap() {
+        const { whiteSpace } = this.options;
+        switch (whiteSpace) {
+            case "nowrap":
+                return "pre";
+            case "normal":
+                return "pre-wrap";
+            default:
+                return whiteSpace;
+        }
+    }
 
-        return text;
-    };
-    BI.shortcut("bi.text", BI.Text);
-}());
+    _getShowText() {
+        const { text: optionsText } = this.options;
+        const text = BI.isFunction(optionsText) ? optionsText() : optionsText;
+
+        return BI.isKey(text) ? Text.formatText(text + "") : text;
+    }
+
+    _doRedMark(keyword) {
+        const { py } = this.options;
+        // render之后做的doRedMark,这个时候虽然标红了，但是之后text mounted执行的时候并没有keyword
+        this.options.keyword = keyword;
+        this.text.element.__textKeywordMarked__(this._getShowText(), keyword, py);
+    }
+
+    doRedMark(keyword) {
+        if (BI.isKey(keyword)) {
+            this._doRedMark(keyword);
+        }
+    }
+
+    unRedMark() {
+        const { py } = this.options;
+        this.options.keyword = "";
+        this.text.element.__textKeywordMarked__(this._getShowText(), "", py);
+    }
+
+    doHighLight() {
+        this.text.element.addClass("bi-high-light");
+    }
+
+    unHighLight() {
+        this.text.element.removeClass("bi-high-light");
+    }
+
+    setValue(text) {
+        super.setValue(text);
+        if (!this.isReadOnly()) {
+            this.setText(text);
+        }
+    }
+
+    setStyle(css) {
+        this.text.element.css(css);
+    }
+
+    setText(text) {
+        super.setText(text);
+        this.options.text = text;
+        this._doRedMark(this.options.keyword);
+    }
+}
+
+const formatters = [];
+Text.addTextFormatter = (formatter) => {
+    formatters.push(formatter);
+};
+Text.formatText = (text) => {
+    if (formatters.length > 0) {
+        for (let i = 0; i < formatters.length; i++) {
+            text = formatters[i](text);
+        }
+    }
 
+    return text;
+};
diff --git a/src/core/controller/controller.drawer.js b/src/core/controller/controller.drawer.js
index 4b2daca9e..b808699c2 100644
--- a/src/core/controller/controller.drawer.js
+++ b/src/core/controller/controller.drawer.js
@@ -6,13 +6,17 @@
  */
 import Controller from "./0.controller";
 export default class DrawerController extends Controller {
+    constructor() {
+        super();
+        this._constructor();
+        this.modal = this.options.modal;
+    }
     props = {
         modal: true, // 模态窗口
         render: "body"
     }
 
     init() {
-        this.modal = this.options.modal;
         this.floatManager = {};
         this.floatLayer = {};
         this.floatContainer = {};
diff --git a/src/core/controller/controller.layer.js b/src/core/controller/controller.layer.js
index a2a6735b7..10092b560 100644
--- a/src/core/controller/controller.layer.js
+++ b/src/core/controller/controller.layer.js
@@ -6,6 +6,11 @@
  */
 import Controller from "./0.controller";
 export default class LayerController extends Controller {
+    constructor() {
+        super();
+        this._constructor();
+    }
+    
     props = {
         render: "body"
     }
diff --git a/src/core/controller/controller.popover.js b/src/core/controller/controller.popover.js
index bcb129f3b..0c48b68ec 100644
--- a/src/core/controller/controller.popover.js
+++ b/src/core/controller/controller.popover.js
@@ -6,13 +6,18 @@
  */
 import Controller from "./0.controller";
 export default class PopoverController extends Controller {
+    constructor() {
+        super();
+        this._constructor();
+        this.modal = this.options.modal;
+    }
+
     props = {
         modal: true, // 模态窗口
         render: "body"
     }
 
     init() {
-        this.modal = this.options.modal;
         this.floatManager = {};
         this.floatLayer = {};
         this.floatContainer = {};
@@ -50,7 +55,7 @@ export default class PopoverController extends Controller {
             const W = BI.Widget._renderEngine.createElement(this.options.render).width(),
                 H = BI.Widget._renderEngine.createElement(this.options.render).height();
             const w = popover.element.width(), h = popover.element.height();
-            const left = (W - w) / 2, top = (H - h) / 2;
+            let left = (W - w) / 2, top = (H - h) / 2;
             if (left < 0) {
                 left = 0;
             }
@@ -110,9 +115,7 @@ export default class PopoverController extends Controller {
             }]
         });
         this.floatManager[name] = popover;
-        (function (key) {
-            popover.on(BI.Popover.EVENT_CLOSE, () => self.close(key));
-        })(name);
+        popover.on(BI.Popover.EVENT_CLOSE, () => this.close(name));
         BI.createWidget({
             type: "bi.absolute",
             element: options.container || this.options.render,
diff --git a/src/core/controller/controller.tooltips.js b/src/core/controller/controller.tooltips.js
index 4b99266e0..0e397aa33 100644
--- a/src/core/controller/controller.tooltips.js
+++ b/src/core/controller/controller.tooltips.js
@@ -38,13 +38,15 @@ export default class TooltipsController extends Controller {
         if (!this.has(name)) {
             this.create(name, tooltipOpt, document.fullscreenElement ? context : (opt.container || "body"));
         }
+        const offset = context.element.offset();
+        let top;
+        
         if (!opt.belowMouse) {
-            const offset = context.element.offset();
             const bounds = context.element.bounds();
             if (bounds.height === 0 || bounds.width === 0) {
                 return;
             }
-            const top = offset.top + bounds.height + 5;
+            top = offset.top + bounds.height + 5;
         }
         const tooltip = this.get(name);
         tooltip.element.css({
diff --git a/src/core/index.js b/src/core/index.js
index 8c345df4c..3727548fc 100644
--- a/src/core/index.js
+++ b/src/core/index.js
@@ -15,6 +15,7 @@ import MaskersController from "./controller/controller.masker";
 import PopoverController from "./controller/controller.popover";
 import ResizeController from "./controller/controller.resizer";
 import TooltipsController from "./controller/controller.tooltips";
+import StyleLoaderManager from "./loader/loader.style";
 
 BI.extend(BI, {
     OB,
@@ -33,6 +34,7 @@ BI.extend(BI, {
     PopoverController,
     ResizeController,
     TooltipsController,
+    StyleLoaderManager,
 });
 
 export {
@@ -53,4 +55,5 @@ export {
     PopoverController,
     ResizeController,
     TooltipsController,
+    StyleLoaderManager,
 }
\ No newline at end of file
diff --git a/src/core/loader/loader.style.js b/src/core/loader/loader.style.js
index ad5500ee5..e10007cc3 100644
--- a/src/core/loader/loader.style.js
+++ b/src/core/loader/loader.style.js
@@ -4,21 +4,23 @@
  * Created by GUY on 2015/9/7.
  * @class
  */
-BI.StyleLoaderManager = BI.inherit(BI.OB, {
-    _defaultConfig: function () {
-        return BI.extend(BI.StyleLoaderManager.superclass._defaultConfig.apply(this, arguments), {});
-    },
+import OB from "../3.ob";
 
-    _init: function () {
-        BI.StyleLoaderManager.superclass._init.apply(this, arguments);
+export default class StyleLoaderManager extends OB {
+    _defaultConfig() {
+        return BI.extend(super._defaultConfig(arguments), {});
+    }
+
+    _init() {
+        super._init(arguments);
         this.stylesManager = {};
-    },
+    }
 
-    loadStyle: function (name, styleString) {
+    loadStyle(name, styleString) {
         if(!_global.document) {
             return;
         }
-        var d = document, styles = d.createElement("style");
+        const d = document, styles = d.createElement("style");
         d.getElementsByTagName("head")[0].appendChild(styles);
         styles.setAttribute("type", "text/css");
         if (styles.styleSheet) {
@@ -29,17 +31,17 @@ BI.StyleLoaderManager = BI.inherit(BI.OB, {
         this.stylesManager[name] = styles;
 
         return this;
-    },
+    }
 
-    get: function (name) {
+    get(name) {
         return this.stylesManager[name];
-    },
+    }
 
-    has: function (name) {
+    has(name) {
         return this.stylesManager[name] != null;
-    },
+    }
 
-    removeStyle: function (name) {
+    removeStyle(name) {
         if (!this.has(name)) {
             return this;
         }
@@ -47,4 +49,4 @@ BI.StyleLoaderManager = BI.inherit(BI.OB, {
         delete this.stylesManager[name];
         return this;
     }
-});
\ No newline at end of file
+}