To create a seamless transition into a separate page on our site, we're going to need to use a single page framework like Nuxt or Next.js. Since Nuxt uses Vue, it is by default a much easier framework to use in my opinion, so we'll be going with that.
To get our three.js piece working in Nuxt, we need to do quite a bit of refactoring, mainly because Nuxt renders its HTML on the server side of things for enhanced performance and SEO. It's a bit of extra work, but by doing so, we'll be able to utilize Nuxt's wonderful routing system that'll load only the exact content we need without ever having to do a full page refresh.
Follow along and let me guide you through the complete refactor process to get three.js working in a real-world project.
PS E:\learning\Web Dev\HTML\Chris Course\firstthreejs> npm install npm ERR! code ERESOLVE npm ERR! ERESOLVE could not resolve npm ERR! npm ERR! While resolving: orbit-controls-es6@2.0.1 npm ERR! Found: three@0.160.1 npm ERR! node_modules/three npm ERR! dev three@"^0.160.1" from the root project npm ERR! npm ERR! Could not resolve dependency: npm ERR! peer three@"0.108.0" from orbit-controls-es6@2.0.1 npm ERR! node_modules/orbit-controls-es6 npm ERR! orbit-controls-es6@"^2.0.1" from the root project npm ERR! npm ERR! Conflicting peer dependency: three@0.108.0 npm ERR! node_modules/three npm ERR! peer three@"0.108.0" from orbit-controls-es6@2.0.1 npm ERR! node_modules/orbit-controls-es6 npm ERR! orbit-controls-es6@"^2.0.1" from the root project npm ERR! npm ERR! Fix the upstream dependency conflict, or retry npm ERR! this command with --force or --legacy-peer-deps npm ERR! to accept an incorrect (and potentially broken) dependency resolution. npm ERR! npm ERR! npm ERR! For a full report see: npm ERR! C:\Users\HKP\AppData\Local\npm-cache\_logs\2024-01-30T16_36_27_684Z-eresolve-report.txt npm ERR! A complete log of this run can be found in: C:\Users\HKP\AppData\Local\npm-cache\_logs\2024-01-30T16_36_27_684Z-debug-0.log
Nuxt is so hard to use
I got this error, and in my website
it said 500
ambiguous indirect export: FlatShading
what should i do the fix it