# Can't load model in webpack dev environment

**URL:** <https://discourse.threejs.org/t/cant-load-model-in-webpack-dev-environment/28394>\
**Category:** Questions\
**Tags:** gltf-loader\
**Created:** [July 27, 2021, 11:46am UTC](https://discourse.threejs.org/t/cant-load-model-in-webpack-dev-environment/28394 "2021-07-27T11:46:47Z")\
**Posts on this page:** 10\
**Page:** 1

<div class="post-metadata">

**Author:** ![Alain](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/alain/32/22764_2.png) [@Alain](https://discourse.threejs.org/u/Alain)\
**Post date:** [July 27, 2021, 11:46am UTC](https://discourse.threejs.org/t/cant-load-model-in-webpack-dev-environment/28394/1 "2021-07-27T11:46:47Z")

</div>

Hi  
How do I have to set the path to the model?  
(I did it like in the documentation)

 ![image](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/5/5/558dccfacf57119b5c55c041f15009403ab92b35.png)

The model can’t be found:

 ![image](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/c/2/c27e3937388393bf0b806faa383952d31f85d7b7.png)

Kind regards  
Alain

---

<div class="post-metadata">

**Author:** ![Ajay](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/ajay/32/42662_2.png) [@Ajay](https://discourse.threejs.org/u/Ajay)\
**Post date:** [July 27, 2021, 12:05pm UTC](https://discourse.threejs.org/t/cant-load-model-in-webpack-dev-environment/28394/2 "2021-07-27T12:05:25Z")

</div>

try this name on loader.load( “./models/building\_02\_220919\_2.gltf”,…)

---

<div class="post-metadata">

**Author:** ![Alain](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/alain/32/22764_2.png) [@Alain](https://discourse.threejs.org/u/Alain)\
**Post date:** [July 27, 2021, 4:34pm UTC](https://discourse.threejs.org/t/cant-load-model-in-webpack-dev-environment/28394/3 "2021-07-27T16:34:29Z")

</div>

Does not work either:  
 ![image](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/b/d/bd55827143eb19efbd448226ea5d9e955d2876f8.png)

 ![image](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/f/7/f714ec1bb47b7d062022aa8db4b6ca511749b5ae.png)

---

<div class="post-metadata">

**Author:** ![donmccurdy](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/donmccurdy/32/33209_2.png) [@donmccurdy](https://discourse.threejs.org/u/donmccurdy)\
**Post date:** [July 27, 2021, 8:18pm UTC](https://discourse.threejs.org/t/cant-load-model-in-webpack-dev-environment/28394/4 "2021-07-27T20:18:31Z")

</div>

webpack may need to be configured to serve static files. see various answers to:

> <https://stackoverflow.com/questions/27639005/how-to-copy-static-files-to-build-directory-with-webpack>

---

<div class="post-metadata">

**Author:** ![Alain](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/alain/32/22764_2.png) [@Alain](https://discourse.threejs.org/u/Alain)\
**Post date:** [July 28, 2021, 8:07am UTC](https://discourse.threejs.org/t/cant-load-model-in-webpack-dev-environment/28394/5 "2021-07-28T08:07:45Z")

</div>

I made it work by putting the file into /static

 ![image](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/5/2/528596322c4dbdb89277968f747fe02321e2aaa5.png)

BUT now Webpack, for some reasons, searches also for a .bin-file-type with the same name and obviously can’t find it.  
How to prevent that unnecessary filepath?

 ![image](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/3/1/314cca96357afda86fb830e583b22ecacc0e8a91.png)

Webpack seems to me a bit overengineered, it makes simple things complicated 🙂

---

<div class="post-metadata">

**Author:** ![Riggio598](https://avatars.discourse-cdn.com/v4/letter/r/ac91a4/32.png) [@Riggio598](https://discourse.threejs.org/u/Riggio598)\
**Post date:** [July 28, 2021, 12:20pm UTC](https://discourse.threejs.org/t/cant-load-model-in-webpack-dev-environment/28394/6 "2021-07-28T12:20:51Z")

</div>

Just another option, if you want to use only a cli interface, just use the `define` option of webpack. I add the following script in my `package.json` :

```javascript
"build-production": "webpack -p --define process.env.NODE_ENV='\"production\"' --progress --colors"

```

So I just have to run `npm run build-production` [.](https://www.myccpay.bid/)

---

<div class="post-metadata">

**Author:** ![Ajay](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/ajay/32/42662_2.png) [@Ajay](https://discourse.threejs.org/u/Ajay)\
**Post date:** [July 29, 2021, 5:32am UTC](https://discourse.threejs.org/t/cant-load-model-in-webpack-dev-environment/28394/7 "2021-07-29T05:32:56Z")

</div>

your import file is not correctly  
set  
like  
import \* as THREE from “…/three js/build/three.js”;  
import { GLTFLoader } from “…/three js/loaders/GLTFLoader.js”;

try to duable dot like ("…/models/building\_02\_220919\_2.gltf”,…)

---

<div class="post-metadata">

**Author:** ![Alain](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/alain/32/22764_2.png) [@Alain](https://discourse.threejs.org/u/Alain)\
**Post date:** [July 29, 2021, 10:19am UTC](https://discourse.threejs.org/t/cant-load-model-in-webpack-dev-environment/28394/8 "2021-07-29T10:19:37Z")

</div>

@Ajay I don’t understand your suggestion.  
Pathes are correct and the threejs-library is imported, else I would get an error-message.

The only thing now is, that webpack, in addition, is searching for building\_02\_220919\_2. **bin** but I only entered building\_02\_220919\_2. **gltf**

How can I prevent Webpack doing this?

---

<div class="post-metadata">

**Author:** ![Alain](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/alain/32/22764_2.png) [@Alain](https://discourse.threejs.org/u/Alain)\
**Post date:** [July 29, 2021, 10:52am UTC](https://discourse.threejs.org/t/cant-load-model-in-webpack-dev-environment/28394/9 "2021-07-29T10:52:46Z")

</div>

It was the point.  
But I don’t know why Webpack searches for \*.bin if you forget the point.

 ![image](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/7/c/7c2c1e8cf50ff34b3151a56d972c5fec73d2253f.png)

---

<div class="post-metadata">

**Author:** ![Ajay](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/ajay/32/42662_2.png) [@Ajay](https://discourse.threejs.org/u/Ajay)\
**Post date:** [July 29, 2021, 11:37am UTC](https://discourse.threejs.org/t/cant-load-model-in-webpack-dev-environment/28394/10 "2021-07-29T11:37:41Z")

</div>

@Alain try to loader manager