How to use VglObjLoader

[0xuhe]

My project structure as follow:
-- public
---- seahorse.obj
-- src
---- views
------ index.vue

The code in index.vue:

<template>
  <vgl-renderer scene="scene1" camera="cam">
    <vgl-scene name="scene1">
      <vgl-obj-loader src="/public/seahorse.obj" />
      <vgl-ambient-light intensity="0.5" />
      <vgl-directional-light
        position="1 1 1"
        intensity="0.5"
      />
    </vgl-scene>
    <vgl-perspective-camera
      name="cam"
      orbit-position="300 1 0.2"
      orbit-target="0 0 -300"
    />
  </vgl-renderer>
</template>

but the console reports errors:

vgl-obj-loader.js?4eb7:formatted:1340 Uncaught TypeError: this.payloadHandler.handlePayload is not a function
at k.processMessage (vgl-obj-loader.js?4eb7:formatted:1340)
at eval (vgl-obj-loader.js?4eb7:formatted:1333)

[h-ikeda]

Did you generate the project with Vue CLI? If so, the path to files in public directory is /seahorse.obj, not /public/seahorse.obj.

Then you should see the object rendered, but the error in console still there...
It may be related mrdoob/three.js#18356 (comment)

[0xuhe]

It works, Thanks for your help~

[0xuhe]

It loads obj file, but the console still report the same error

[renaudham]

Hi
My own guess as a new user.
I think it's only on hot refresh, while in dev mode in VueJs.
If you reload all the page, I don't see it anymore, and apparenlty it's not an issue on build.

But i'm not sure, newbie