v3d.module.js import problem

This topic has 7 replies, 6 voices, and was last updated 1 year, 3 months ago by Yuri Kovelenov.

Viewing 8 posts - 1 through 8 (of 8 total)

Author

Posts
2020-07-29 at 10:19 am #30851
core3d
Customer
I’m trying to import some modules but i’m getting error:

Uncaught SyntaxError: Cannot use import statement outside a module

Is there any other step should i do?
```
'use strict';

/* __V3D_TEMPLATE__ - template-based file; delete this line to prevent this file from being updated */
import * as verge from '../../build/v3d.module.js';
import { PointerLockControls } from './PointerLockControls.js';

window.addEventListener('load', function() {

var CONTAINER_ID = 'v3d-container';
```
2020-07-31 at 7:48 am #30979

Alexander Kovelenov
Staff

It says that your main JS file is not loaded as module. Use

<script src="yourapp.js" type="module">

to denote that you’re importing it as module.

Soft8Soft Tech Chief
X | FB | LinkedIn

2020-07-31 at 8:45 am #30988

core3d
Customer

yes i was figured out, thanks anyway

2020-07-31 at 9:02 am #30989

Yuri Kovelenov
Staff

Chief 3D Verger | LinkedIn | Twitter

2021-08-10 at 12:12 am #43543

jdhutchinson
Customer

Dear Alexander,

Could you explain as a beginner .js and verge user what the:

'../../build/ part of the import statement relates to?

Is it more complex than simply having downloaded referenced .js files in between script tags?

2023-01-16 at 6:42 am #59596

tonygruz
Participant

core3d wrote:

Uncaught SyntaxError: Cannot use import statement outside a module

To solve the error, set the type attribute to module when loading the script in your HTML code. When working with ECMAScript modules and JavaScript module import statements in the browser, you’ll need to explicitly tell the browser that a script is module. To do this, you have to add type=”module” onto any ‹script› tags that point to a JavaScript module. Once you do this you can import that module without issues.

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

If you are working on Node.js or react applications and using import statements instead of require to load the modules, then ensure your package.json has a property “type”: “module” as shown below.

{
// …
“type”: “module”,
// …
}

Moreover, In some cases, you may have to use both import and require statements to load the module properly.

// import { parse } from ‘node-html-parser’;
parse = require(‘node-html-parser’);

This error “Cannot use import statement outside a module ” can happen in different cases depending on whether you’re working with JavaScript on the server-side with Node.js , or client-side in the browser. There are several reasons behind this error, and the solution depends on how you call the module or script tag.

2023-09-15 at 3:28 am #66825

Anonymous
Inactive

It appears that you are encountering an issue with importing the v3d.module.js module. The v3d.module.js file is typically associated with the Three.js library, which is used for 3D graphics programming in JavaScript.
To troubleshoot the problem, you can follow these steps:
1. Check File Path: Ensure that the v3d.module.js file is located in the correct directory and that the file path you’re using in your import statement is accurate. Double-check the spelling, capitalization, and folder structure to make sure everything is correct.
2. Confirm File Availability: Verify that the v3d.module.js file is present in the specified location and is accessible. You can manually navigate to the file location using a file explorer or IDE to ensure it exists.
3. Dependency Installation: If you’re using a package manager like npm or yarn, make sure you have installed the Three.js library and its dependencies correctly. You can do this by running the appropriate command in your project directory:
For npm:

npm install three
`

For yarn:

yarn add three
`

This will install the Three.js library and its dependencies in your project.

4. Import Statement Syntax: Verify that your import statement for v3d.module.js is correct. The syntax for importing the module should look like this:

javascript
import * as THREE from ‘./path/to/v3d.module.js’;
`

Make sure that the file path is relative to the current file or use an absolute path if necessary.
5. Module Support: Ensure that your JavaScript environment supports ES6 modules, as the import statement is part of the ES6 module system. Not all environments natively support ES6 modules, so you may need to configure your project or use a bundler like Webpack or Rollup to handle the module imports.
6. File Extension Compatibility: Check if your development environment or module bundler is set up to handle the .module.js file extension. In some cases, you may need to configure your build system to recognize and process files with that extension.
If you have followed these steps and are still encountering issues with importing v3d.module.js, please provide additional details such as the specific error message you are receiving, the development environment you are using, and any relevant code snippets. This information will help in further troubleshooting the problem.

2023-09-15 at 6:10 am #66830

Yuri Kovelenov
Staff

ChatGPT?

Chief 3D Verger | LinkedIn | Twitter
Author

Posts