azure-sdk-for-js: Can't resolve node:os / node:process modules in React application
- Package Name: @azure/core-rest-pipeline, @azure/app-configuration, and @azure/logger
- Package Version:
- Operating system:
- nodejs
- version: 18.19.1
- browser
- name/version: Chrome 122.0.6261.129
- typescript
- version: 5.4.2
- Is the bug related to documentation in
- README.md
- source code documentation
- SDK API docs on https://docs.microsoft.com
Describe the bug
When trying to start a react app that utilizes @azure/app-configuration
we are seeing the following error at startup/build time:
Failed to compile.
./node_modules/@azure/core-rest-pipeline/dist/commonjs/util/userAgentPlatform.js
Module not found: Can't resolve 'node:os' in '/Users/paulsmith/byteui/node_modules/@azure/core-rest-pipeline/dist/commonjs/util'
To Reproduce Steps to reproduce the behavior:
- Create a new react app with Create React App
- Integrate the
@azure/app-configuration
package to fetch feature flags at runtime, using a connection string.
export async function getFeatureFlag(connectionString: string, name: string): Promise<boolean> {
const client = new AppConfigurationClient(connectionString);
const setting = await client.getConfigurationSetting({ key: '.appconfig.featureflag/' + name });
const enabled = setting.value ? JSON.parse(setting.value)?.enabled : undefined;
return !!enabled;
}
- Start the project with
npm start
Expected behavior React app starts without issue.
Screenshots If applicable, add screenshots to help explain your problem.
Additional context Build was working up until yesterday, and then it started pulling in the node version of the apis instead of the browser versions.
About this issue
- Original URL
- State: closed
- Created 4 months ago
- Comments: 21 (7 by maintainers)
Hi all, thanks for your patience as we investigate the issue. We are restoring the
browser
top-level field to the package.json of the affected packages (see PR) which should allow Webpack 4 to continue working. I will post an update here once this has released (planning on tomorrow).@xirzec We were using both
@azure/app-configuration
and@azure/storage-blob
in only one place each, and in both cases the@azure
packages weren’t doing much more than wrapping a single HTTP request.In effect they were bloating up the website which code that ended up being largely unused. As such, it was much more practical & efficient for us to replace them with direct HTTP requests to Azure.
This issue was prevent our whole website from building. So we needed a quick fix, that would allow us to gradually update components. Updating CRA/Webpack requires a lot more regression testing, and updates in other areas that aren’t compatible with Webpack 5. (One example being that jsonwebtoken is not compatible with Webpack 5, so we’ll need to swap over to jose before we can update the site.)
Related API Docs