Add main prop for older webpack support

[kevpie]

enables @bufbuild/protobuf to resolve in my Create React App 4.0, Typescript project.

I'm not sure if there are other ways around this. But in my project it seemed to allow everything to resolve and build with tsc when using target=ts.

[CLAassistant]

All committers have signed the CLA.

[smaye81]

Hi, @kevpie. Thanks for the contribution! Can you provide a bit more details on the errors you are seeing? We want to make sure whatever issues you're experiencing are properly fixed and investigate a bit further. Thanks again.

[kevpie]

I get this error when running yarn build.

$ yarn build
yarn run v1.22.18
$ DISABLE_ESLINT_PLUGIN=true react-scripts build
Creating an optimized production build...
Failed to compile.

./src/App.jsx
Cannot find module: '@bufbuild/protobuf'. Make sure this package is installed.

You can install this package by running: yarn add @bufbuild/protobuf.


error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

The @bufbuild/protobuf is there in node_modules. My eslint also complains until I add the change in this PR.
I also tested with altering "main" to point to the cjs module and that works as well.

What else would be useful info to help trouble shoot?
I created a fresh Create React App (5.) from scratch and it doesn't have any import issues.
I'm testing by:

import { protoInt64 } from '@bufbuild/protobuf'
console.log(protoInt64.parse('1234'))

[smaye81]

Sorry for the delay. We looked into this issue and it's related to the usage of conditional exports in our package.json.

Webpack added support for the exports keyword in version 5. However, older versions (< 5.x) do not support exports. Create React App 4.0 seems to be using v4.44.x of Webpack.

Ideally, we'd recommend upgrading your codebase to make use of Webpack 5, but we recognize there are numerous projects out there making use of older versions of Webpack. So we will support it for the time being and eventually remove it once Webpack 5 has been out for an extended period of time.

If you'd like to mark your PR as ready for review, I can stamp it and merge. Thanks again for the contribution.

[kevpie]

Thank your for the detailed response!
Marked as ready for review.

Will look into upgrading to Webpack 5.