diff --git a/src/web/app/common/define-widget.ts b/src/web/app/common/define-widget.ts
new file mode 100644
index 0000000000..9aed5a8902
--- /dev/null
+++ b/src/web/app/common/define-widget.ts
@@ -0,0 +1,51 @@
+import Vue from 'vue';
+
+export default function(data: {
+	name: string;
+	props: any;
+}) {
+	return Vue.extend({
+		props: {
+			wid: {
+				type: String,
+				required: true
+			},
+			place: {
+				type: String,
+				required: true
+			},
+			wprops: {
+				type: Object,
+				required: false
+			}
+		},
+		computed: {
+			id(): string {
+				return this.wid;
+			}
+		},
+		data() {
+			return {
+				props: data.props
+			};
+		},
+		watch: {
+			props(newProps, oldProps) {
+				if (JSON.stringify(newProps) == JSON.stringify(oldProps)) return;
+				this.$root.$data.os.api('i/update_home', {
+					id: this.id,
+					data: newProps
+				}).then(() => {
+					this.$root.$data.os.i.client_settings.home.find(w => w.id == this.id).data = newProps;
+				});
+			}
+		},
+		created() {
+			if (this.props) {
+				Object.keys(this.wprops).forEach(prop => {
+					this.props[prop] = this.props.data.hasOwnProperty(prop) ? this.props.data[prop] : this.props[prop];
+				});
+			}
+		}
+	});
+}
diff --git a/src/web/app/common/views/components/widgets/profile.vue b/src/web/app/common/views/components/widgets/profile.vue
new file mode 100644
index 0000000000..4a22d2391b
--- /dev/null
+++ b/src/web/app/common/views/components/widgets/profile.vue
@@ -0,0 +1,5 @@
+<template>
+<div class="mkw-profile">
+
+</div>
+</template>
diff --git a/webpack/module/rules/license.ts b/webpack/module/rules/license.ts
index de8b7d79fb..e3aaefa2bf 100644
--- a/webpack/module/rules/license.ts
+++ b/webpack/module/rules/license.ts
@@ -7,7 +7,7 @@ import { licenseHtml } from '../../../src/common/build/license';
 
 export default () => ({
 	enforce: 'pre',
-	test: /\.(tag|js)$/,
+	test: /\.(vue|js)$/,
 	exclude: /node_modules/,
 	loader: StringReplacePlugin.replace({
 		replacements: [{