defineComponent for lights (#10)

src/lights/AmbientLight.js

@@ -1,11 +1,12 @@
+import { defineComponent } from 'vue';
 import { AmbientLight } from 'three';
 import Light from './Light.js';
 
-export default {
+export default defineComponent({
   extends: Light,
   created() {
     this.light = new AmbientLight(this.color, this.intensity);
     this.initLight();
   },
   __hmrId: 'AmbientLight',
-};
+});

src/lights/DirectionalLight.js

@@ -1,7 +1,8 @@
+import { defineComponent } from 'vue';
 import { DirectionalLight } from 'three';
 import Light from './Light.js';
 
-export default {
+export default defineComponent({
   extends: Light,
   props: {
     target: Object,
@@ -11,4 +12,4 @@ export default {
     this.initLight();
   },
   __hmrId: 'DirectionalLight',
-};
+});

src/lights/HemisphereLight.js

@@ -1,8 +1,8 @@
+import { defineComponent, watch } from 'vue';
 import { HemisphereLight } from 'three';
-import { watch } from 'vue';
 import Light from './Light.js';
 
-export default {
+export default defineComponent({
   extends: Light,
   props: {
     groundColor: { type: String, default: '#444444' },
@@ -13,4 +13,4 @@ export default {
     this.initLight();
   },
   __hmrId: 'HemisphereLight',
-};
+});

src/lights/Light.js

@@ -1,8 +1,8 @@
-import { watch } from 'vue';
+import { defineComponent, watch } from 'vue';
 import Object3D from '../core/Object3D.js';
 import { bindProp, setFromProp } from '../tools';
 
-export default {
+export default defineComponent({
   extends: Object3D,
   name: 'Light',
   props: {
@@ -44,4 +44,4 @@ export default {
     },
   },
   __hmrId: 'Light',
-};
+});

src/lights/PointLight.js

@@ -1,7 +1,8 @@
+import { defineComponent } from 'vue';
 import { PointLight } from 'three';
 import Light from './Light.js';
 
-export default {
+export default defineComponent({
   extends: Light,
   props: {
     distance: {
@@ -18,4 +19,4 @@ export default {
     this.initLight();
   },
   __hmrId: 'PointLight',
-};
+});

src/lights/RectAreaLight.js

@@ -1,10 +1,10 @@
+import { defineComponent, watch } from 'vue';
 import { RectAreaLight } from 'three';
 import { RectAreaLightUniformsLib } from 'three/examples/jsm/lights/RectAreaLightUniformsLib.js';
 import { RectAreaLightHelper } from 'three/examples/jsm/helpers/RectAreaLightHelper.js';
-import { watch } from 'vue';
 import Light from './Light.js';
 
-export default {
+export default defineComponent({
   extends: Light,
   props: {
     width: { type: Number, default: 10 },
@@ -32,4 +32,4 @@ export default {
     if (this.lightHelper) this.removeFromParent(this.lightHelper);
   },
   __hmrId: 'RectAreaLight',
-};
+});

src/lights/SpotLight.js

@@ -1,8 +1,8 @@
+import { defineComponent, watch } from 'vue';
 import { SpotLight } from 'three';
-import { watch } from 'vue';
 import Light from './Light.js';
 
-export default {
+export default defineComponent({
   extends: Light,
   props: {
     angle: { type: Number, default: Math.PI / 3 },
@@ -21,4 +21,4 @@ export default {
     this.initLight();
   },
   __hmrId: 'SpotLight',
-};
+});