use webpack / loadTexture fail

Description of the problem

demo url: https://threejs.org/examples/#canvas_geometry_panorama_fisheye

 var materials = [
        loadTexture(require('./img/px.jpg')), // right
        loadTexture(require('./img/nx.jpg')), // left
        loadTexture(require('./img/py.jpg')), // top
        loadTexture(require('./img/ny.jpg')), // bottom
        loadTexture(require('./img/pz.jpg')), // back
        loadTexture(require('./img/nz.jpg')) // front
 ];

webpack.config

 {
                test: /\.(jpg|png|gif)$/,
                use: {
                    loader: 'file-loader',
                }
 },

there is no error, but …
image

how can i fix it?

Three.js version
"three": "^0.85.2"
Browser
  • All of them
OS
  • macOS
Hardware Requirements (graphics card, VR Device, …)

Author: Fantashit

1 thought on “use webpack / loadTexture fail

  1. @yangbin1994 thanks
    the require(“xxx.jpg”) methods is very useful.

    my examples in vue-cli project

    var texture = new THREE.TextureLoader().load(require("../assets/floor.jpg"));
    

Comments are closed.