Need help with including Dynamic Terrain extension. TypeError DynamicTerrain is not a constructor

It is hard because you are mixing none module code and module code so it involves a bit of config. There are several ways to solve the issue in the config. Let me detail one:

  1. Use ProvidePlugin to expose BABYLON as a global:
plugins: [
    new webpack.ProvidePlugin({
        'BABYLON': 'babylonjs'
    })
]
  1. Force the terrain script to consider BABYLON from the module babylonjs:
module: {
    rules: [{
        test: /\.tsx?$/,
        loader: 'ts-loader'
    }, {
        test: /\dynamicTerrain.js\.js$/,
        use: [ 'imports-loader?BABYLON=>require("babylonjs")' ]
    }]
},

Please not it require the imports-loader package: npm install imports-loader --save-dev
3. In your ts file where you need to use Babylon and the Material, reference their typings:

/// <reference types="babylonjs"/>
/// <reference path="./externals/babylon.dynamicTerrain.d.ts"/>
  1. Import the dynamic terrain for side effects:
import "./externals/babylon.dynamicTerrain.js";
  1. You can now use both of then in the ts file with typings.

Find attached an ultra quick sample, forumBug.zip (21.0 KB) To run it, unzip,
npm install then npm run start the ideal would be to make the extension a proper npm package to prevent some of those issues.

This is still not ideal as we are relying here on namespace typings vs module but it should be ok.

The code comes from the default example in the terrain documentation.

2 Likes