Threejs TypeScript : Dat.gui

Channel:
United Kingdom SBCODE
Subscribers:
24,900
Published on ● Video Link: https://www.youtube.com/watch?v=GsyZ9Yc3HZs


Duration: 8:45
4,584 views
66

Documentation : https://sbcode.net/threejs/dat-gui/
YT Members : https://www.youtube.com/channel/UCmUILI2AWt2MSUgPlZwFdOg/join
Three.js and TypeScript (Book) : https://www.amazon.com/dp/B09GYTKRCH
Course Coupons : https://sbcode.net/coupons#threejs

The Dat GUI is another very useful tool that we can use to learn about Three.js as it allows us to quickly add a very basic user interface which allows us to interact with our 3d scene and the objects within it.
The Three.js install includes a copy of dat.gui.module.js so we will use that. And we can also add a copy of the type definitions file.

npm install @types/dat.gui

We also need to inform the VSCode IDE and the TypeScript compiler which type definition file to use for the imported dat.gui.module file.

You have several options here to correct the missing type definition reference.

One option is to manually copy the file index.d.ts from the node_modules/@types/dat.gui folder into the node_modules/three/examples/jsm/libs folder and rename it to dat.gui.module.d.ts.

or

add a path to the ./src/client/tsconfig.json that indicates to the VSCode IDE and TypeScript compiler which type definition to use when it sees the import to /jsm/libs/dat.gui.module

#dat.gui
#threejsdatgui
#datgui
#threejs



Other Videos By SBCODE


2021-03-06Abstract Factory Use Case : Design Patterns In Python
2021-03-06Abstract Factory : Design Patterns In Python
2021-03-05ABCMeta : Design Patterns In Python
2021-03-05Factory Pattern Use Case : Design Patterns In Python
2021-03-05Factory : Design Patterns In Python
2021-03-04UML Diagrams : Design Patterns In Python
2021-03-02Coding Conventions : Design Patterns In Python
2021-03-02Development Environment Setup : Design Patterns In Python
2021-02-26Trying a Wireless UHF Mic with iPhone
2021-02-25Testing a Budget USB Wireless UHF Headset/Lapel Mic
2021-01-28Threejs TypeScript : Dat.gui
2020-12-15Elasticsearch Cluster Tutorial : Part 2
2020-12-15Elasticsearch Cluster Tutorial : Part 1
2020-12-11Setup Behringer C-1U USB Microphone in Windows and OBS
2020-11-24Remove And Replace Dyson Animal Battery
2020-11-20Adding Dishwasher Salt To Your Dishwasher
2020-11-13TP-Link AV600 Powerline Quick Setup
2020-11-11How To Balance Your Phone In The Freevision Vilta M Pro
2020-11-05Prometheus : Course Introduction
2020-11-04Prometheus : Query SNMP from a CISCO Switch
2020-11-02Prometheus : Configure a Second External SNMP Daemon


Tags:
threejs
dat.gui
threejs tutorials
threejs typescript