I went through a few similar topics here on SO but I can't find a solution to my problem. The issue is that .glb model doesn't load at all. My Vue app uses webpack (I use Quasar framework which has built-in webpack). I configured Webpack to bundle .glb files (I read that file-loader is sufficient here). It doesn't help. My model sits in assets folder. Some say that 3D model should be placed in public (or static) folder. I've tried it and both solutions don't work in my case.

I loaded model to main_three.js and updated webpack in quasar.conf.js. Here is a reproducible example: https://codesandbox.io/s/interesting-mendeleev-3e1zoy?file=/src/store/model/main_three.js

main_three.js

import { GLTFLoader } from "three/examples/jsm/loaders/GLTFLoader.js";

const loader = new GLTFLoader();
loader.load("~assets/Flower.glb", (glb) => {
  state.scene.add(glb.scene);
});

quasar.conf.js

chainWebpack(chain) {
  chain.module.rule('glb')
  .test(/\.glb$/)
  .use('file-loader')
  .loader('file-loader')
}