Update model-viewer version from 1.10.1 to 2.1.1 compile error

[NitinJ88]

Description

While updating model-viewer version from 1.10.1 to 2.1.1 got the following compile error.

I am not sure which loader is expected to install.

Live Demo

https://glitch.com/edit/#!/model-viewer

Version

• model-viewer: v2.1.1

Browser Affected

• Chrome, version: xx.x.xxxx.xx
• Edge
• Firefox
• IE
• Safari

OS

• Android
• iOS
• Linux
• MacOS
• [*] Windows

AR

• [ *] WebXR
• SceneViewer
• [ *] QuickLook

[elalish]

It failed to parse your glTF, which likely means your glTF has an error and our importer has changed and no longer ignores this error. Try it in our editor and see if the file produces errors (it runs the official glTF validator automatically on load).

[NitinJ88]

This issue is because of "Optional Chaining" character use in "GLTFExporter.js" file at line number 749. Not sure which parser/library package I need add into my repo to get rid of this error. I tried adding "@babel/plugin-proposal-optional-chaining" but it did not help. I don't have sample repo to replicate this issue as of now. I will create one if needed.

[elalish]

Oh, interesting. Are you building from our source or using our bundle? Our bundler takes care of removing any modern JS like that; we include model-viewer-umd.min.js as a version that's usable across the widest range of legacy systems. If you're using a package.json to set this up, perhaps you could paste it here?

[NitinJ88]

We use webpack 4 to bundle our source. I have attached our package.json.
package.json.txt

[elalish]

We use rollup as our bundler, which is configured here. Looks like optional chaining is part of ES2020, so you may need to target that.

[elalish]

I saw a note in the three.js r149 release docs saying they removed all the >ES2018 JS, which I bet was this problem. We just merged this, so hopefully the next release will have it fixed for you.