Module Namespacing Support for Packages

Summary

When installing a package that uses module namespacing (export * as {moduleName} from './{moduleName}), Expo’s default configuration throws an error when compiling for web and iOS. This is an important tool for structuring TypeScript code, so I’d expect it to work out of the box.

Managed or bare workflow? If you have ios/ or android/ directories in your project, the answer is bare!

bare

What platform(s) does this occur on?

iOS, Web

SDK Version (managed workflow only)

4.5.2

Environment

MacOS, Node v14.15.5.

Reproducible demo or steps to reproduce from a blank project

https://snack.expo.io/kSlfJiSnR

Steps to reproduce:

• npm install @dfinity/agent
• Somewhere in the code - import { HttpAgent } from "@dfinity/agent";

[krpeacock]

Ah right, that’s the domain-specific stuff. I’ll unignore that folder and push it up for reproduction to spare you from needing to install our SDK. You won’t end up with a fully working example, but the frontend should compile

[byCedric]

Yes, that’s also possible! I’m not sure how Snack would react, but we can always find a solution for that later.

• With normal npm modules, you should be able to define main file as entrypoint (defaults to index.js). This could contain plain Common JS code.
• With tools like Rollup and Webpack, you can define a module entrypoint. (although this isn’t an “official” spec, it’s still in proposal state). This could contain the ESM code.
• With React Native, you can define a react-native entry point. (couldn’t find the docs for this, but you can see it there in action). This could contain the Common JS code, with some polyfills included.

All of these can be defined in the package.json, and there are a few like typings for TS. This guide might help making sense of some of these.

Other companies using Web3 opted for a separate React Native package. This is also fine and worth taking a look at, e.g. Magic Link