diff --git a/packages/loading/index.js b/packages/loading/index.tsx
similarity index 77%
rename from packages/loading/index.js
rename to packages/loading/index.tsx
index a7772857b..7440a5690 100644
--- a/packages/loading/index.js
+++ b/packages/loading/index.tsx
@@ -1,10 +1,18 @@
 import { use } from '../utils';
 import { inherit } from '../utils/functional';
 
+// Types
+import { FunctionalComponent } from '../utils/use/sfc';
+
 const [sfc, bem] = use('loading');
 const DEFAULT_COLOR = '#c9c9c9';
 
-function Loading(h, props, slots, ctx) {
+const Loading: FunctionalComponent<LoadingProps> = function(
+  h,
+  props,
+  slots,
+  ctx
+) {
   const { color, size, type } = props;
 
   const colorType = color === 'white' || color === 'black' ? color : '';
@@ -36,7 +44,7 @@ function Loading(h, props, slots, ctx) {
       </span>
     </div>
   );
-}
+};
 
 Loading.props = {
   size: String,
@@ -50,4 +58,10 @@ Loading.props = {
   }
 };
 
-export default sfc(Loading);
+export type LoadingProps = {
+  size?: string;
+  type?: string;
+  color?: string;
+};
+
+export default sfc<LoadingProps>(Loading);