Import * as BABYLON from '@babylon/core' throws error

Hello!
I’m super inexperienced to babylon.js and web development in general, so I might just be messing up something very basic. Also, apologies if this post is in the wrong category!

My file structure is as follows:
migration-animation
|—dist
|—node_modules
|—src
|—|—index.js
|—index.html
|—package-lock.json
|—package.json

The commands I’ve run for this project so far are:
npm init
npm install @babylonjs/core --save
npm install @babylonjs/materials --save
npm install webpack webpack-cli webpack-dev-server --save-dev
In the index.html file, I have:

<script type="module" src="./src/index.js"></script>

In the index.js file, I have:

import * as BABYLON from "@babylonjs/core/Legacy/legacy";

This causes the following error:

Uncaught TypeError: Failed to resolve module specifier "@babylonjs/core/Legacy/legacy". Relative references must start with either "/", "./", or "../".

Any advice would be much appreciated!

It looks like you install webpack but are not using it.

As you are only starting web dev, before diving into packing and such I would suggest you rely on our cdn version: The Very First Step | Babylon.js Documentation

1 Like