Error: Can't resolve 'ol/Feature.js' using react-scripts without TypeScript

[brianbancroft]

This error occurs when using the app in a [non-typescript] create-react-app-setup. When I attempt to import the geojson module, I see the following error:

DependencyNotFoundError
Could not find dependency: 'ol' relative to '/node_modules/flatgeobuf/lib/mjs/ol/feature.js'

Issue goes away when I install ol, but this is not ideal because I am using this library for processes that do not involve openlayers.

Minimal Example

The following is a codesandbox, where I attempt to import the module.

https://codesandbox.io/s/epic-blackburn-0gexn3

Screen.Recording.2022-11-03.at.10.46.07.AM.mov

Desired behaviour

I would hope not to see this error or to require to install openlayers unless I am using the openlayers module.

[bjornharrtell]

I'm suspecting your tooling of being unable to properly determine that it doesn't need the ol package.

I believe you can workaround this by importing the geojson module directly from flatgeobuf/lib/mjs/geojson.js.

[brianbancroft]

The benefit of create-react-app (CRA) is that the tooling is opaque, and not something which I control, which is why it's the default for many front-end developers for projects or other work. After diving a bit deeper into this, I believe this could be a problem with the webpack configuration for react-scripts and/or how this library manages its imports/exports. I can't say. But I don't think this is an issue worth fixing directly by your team.

Using the direct import method as you suggested works.

import flatgeobuf from 'flatgeobuf/lib/mjs/geojson.js';

This workaround works in create-react-app as well as in the codesandbox minimal example.

I have also attempted to reproduce the problem in other common configurations. This issue only happens when I'm using create-react-app (or the react-scripts library). It works fine for the following:

• Rollup
• ES Modules
• Vite
• Basic custom webpack configurations (such as those generated via createapp.dev)
• Next JS, a popular React framework
• Remix, another React framework
• react-scripts/CRA, when using typescript.

I think it may make more sense to document than to fix for the sake of other developers who come here using CRA.

[bjornharrtell]

Thanks for the in depth analysis @brianbancroft. I will consider adding a FAQ entry referencing this issue.

[brianbancroft]

Thank you!

[bjornharrtell]

Done with 1179197.

[brianbancroft]

@bjornharrtell hi. Following up.

It might be worth dropping the FAQ you kindly created for my edge case. Create React App/React Scripts was sunsetted in 2025.

Thanks again for the workaround!