Webpack错误：GET http://127.0.0.1:5500/[object%20Module]

问题描述

我正在使用Webpack加载图像。它以某种方式在dist文件夹中生成具有随机名称的图像，但未在浏览器中显示GET http://127.0.0.1:5500/[object%20Module] 这是我的 webpack.config.js文件

const path = require("path");

module.exports = {
  // Path to your entry point. From this file Webpack will begin his work
  entry: "./src/javascript/index.js",output: {
    path: path.resolve(__dirname,"dist"),filename: "bundle.js",},mode: "development",module: {
    rules: [
      {
        test: /\.(png|svg|jpg|gif)$/,use: ["file-loader"],],};

这是我导入图像的 index.js 文件

const THREE = require("three");
const renderer = new THREE.WebGLRenderer();

const container = document.querySelector("#container");
const globeImage = require("../img/globeImage.jpg");

const WIDTH = window.innerWidth;
const HEIGHT = window.innerHeight;
renderer.setSize(WIDTH,HEIGHT);

const VIEW_ANGLE = 45;
const ASPECT = WIDTH / HEIGHT;
const NEAR = 0.1;
const FAR = 10000;

const camera = new THREE.PerspectiveCamera(VIEW_ANGLE,ASPECT,NEAR,FAR);

camera.position.set(0,500);

const scene = new THREE.Scene();

scene.background = new THREE.Color(0x000);

scene.add(camera);

container.appendChild(renderer.domElement);

const RADIUS = 200;
const SEGMENTS = 50;
const RINGS = 50;

const globe = new THREE.Group();
scene.add(globe);

const loader = new THREE.TextureLoader();

loader.load(globeImage,function (texture) {
  // Create the sphere
  var sphere = new THREE.SphereGeometry(RADIUS,SEGMENTS,RINGS);
  // Map the texture to the material.
  var material = new THREE.MeshBasicMaterial({ map: texture,overdraw: 0.5 });
  // Create a new mesh with sphere geometry.
  var mesh = new THREE.Mesh(sphere,material);
  // Add mesh to globe
  globe.add(mesh);
});

globe.position.z = -300;

const pointLight = new THREE.PointLight(0xffffff);

pointLight.position.x = 10;
pointLight.position.y = 50;
pointLight.position.z = 400;

scene.add(pointLight);

这是我的 package.json 文件

{
  "name": "3dglobe","version": "1.0.0","description": "","main": "index.js","scripts": {
    "build": "webpack --config webpack.config.js"
  },"keywords": [],"author": "","license": "ISC","dependencies": {
    "three": "^0.122.0"
  },"devDependencies": {
    "file-loader": "^6.2.0","webpack": "^5.4.0","webpack-cli": "^4.2.0"
  }
}

这是我遇到的错误 [我得到的错误] [1] [1]：https：//i.stack.imgur.com/QIDq8.png

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）