added ground with texture

assets/index.d.ts

@@ -0,0 +1,4 @@
+declare module '*.jpg' {
+    const value: any
+    export = value;
+  }

src/index.ts

@@ -1,5 +1,6 @@
 import * as BABYLON from '@babylonjs/core'; 
-import { SkyMaterial } from '@babylonjs/materials'
+import { SkyMaterial } from '@babylonjs/materials';
+import img from '../assets/wood_floor_diff_4k.jpg';
 
 const canvas = document.createElement('canvas');
 canvas.id = "render-canvas";
@@ -22,7 +23,17 @@ skybox.material = skyMaterial;
 
 const light = new BABYLON.HemisphericLight('light1', new BABYLON.Vector3(1, 1, 0), scene);
 
-const cube = BABYLON.MeshBuilder.CreateBox('box', {}, scene);
+const cube = BABYLON.MeshBuilder.CreateBox('box', {size: 1}, scene);
+cube.translate(new BABYLON.Vector3(0, 1, 0), 0.5001);
+
+const ground = BABYLON.MeshBuilder.CreateGround('ground', {width:15, height:15}, scene);
+const groundMat = new BABYLON.StandardMaterial('groundMaterial', scene);
+const woodTex = new BABYLON.Texture(img, scene);
+woodTex.uScale = ground._width/2;
+woodTex.vScale = ground._height/2;
+groundMat.diffuseTexture = woodTex;
+groundMat.backFaceCulling = false;
+ground.material = groundMat;
 
 engine.runRenderLoop(() => {
     scene.render();

tsconfig.json

@@ -14,5 +14,5 @@
     "skipLibCheck": true,    
     "outDir": "./dist"                             
   },
-  "include": ["src"]
+  "include": ["src", "assets"]
 }

webpack.config.js

@@ -12,7 +12,11 @@ module.exports = {
         test: /\.ts$/,
         use: 'ts-loader',
         exclude: /node_modules/
-      }
+      },
+      {
+        test: /\.(png|svg|jpg|jpeg|gif)$/i,
+        type: 'asset/resource',
+      },
     ]
   },
   resolve: {