NextJS client component: Module parse failed: Export 'BSON' is not defined
#9959
Comments
|
|
|
Same error here. We use typeorm in combination with a local sql lite database in capacitor for building an ios app, android app and electron app. Happens after updating to |
In your case, it seems like a bug caused by PR #9925. Please make an issue. |
|
let's ask @mptr for help here. I do see |
|
I am having the same issue here. However, this is my first time using typeorm so I am not sure if this is a misconfiguration issue from my part. |
|
@spotykatch yes we can do it, but we also need to ensure problem is with browser version. Would be great if someone can replace the typings to dummy once & test it, and create a PR with the changes. |
|
@pleerock I can't test it from my current location, can you please launch CircleCI on the pr? |
|
I don't think CI can test this change. Manual test is required. |
|
Ok, I'll switch it back to pr when I'm done |
|
The error is still there. Gulp compiles dummy to platform folder, but the original file is not replaced. I'm definitely doing something wrong. You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
> export { BSON };
|
| //# sourceMappingURL=bson.typings.js.map
Import trace for requested module:
./node_modules/typeorm/browser/driver/mongodb/bson.typings.js
./node_modules/typeorm/browser/driver/mongodb/typings.js
./node_modules/typeorm/browser/index.js
./lib/database.ts
./app/page.tsx |
|
Need help, @imnotjames, @chriswep, @daniel-lang. |
|
Just for the sake of trying, I replaced the module with the following: But seems the types are needed even though I'm using EDIT: Note that despite all the errors I can still execute my code this way but yeah definitely not something that can do in production. |
|
Same issue for me... |
Closes: typeorm#9959 fix: delete unnessecary dummy file
|
Please check this test repository. That uses future build (I guess). |
|
Can someone help me with another test? I'm pretty sure it solves the |
|
Hi! thanks for this @spotykatch. I was browsing through the repo, not 100% sure which changes I should apply to my Next.JS app. To start I just added the /** @type {import('next').NextConfig} */
const nextConfig = {
reactStrictMode: true,
experimental: {
appDir: true,
},
webpack: (config, { isServer, webpack }) => {
if (!isServer) {
config.resolve.fallback.fs = false;
}
config.plugins = [
new webpack.NormalModuleReplacementPlugin(/typeorm$/, function (result) {
result.request = result.request.replace(/typeorm/, "typeorm/browser");
}),
];
return config;
},
}
module.exports = nextConfigWhen I do the change I get an error though: |
|
Thanks for the question @argaen. It helped me to figure out that pr does not work for next. Here's my webpack config // ...
webpack: (config, { webpack }) => {
config.resolve.fallback = {
...config.resolve.fallback,
fs: false,
crypto: false,
path: false,
"react-native-sqlite-storage": false,
"aws-sdk": false
};
config.plugins = [
...config.plugins,
new webpack.NormalModuleReplacementPlugin(/typeorm$/, function (result) {
result.request = result.request.replace(/typeorm/, "typeorm/browser");
}),
new webpack.ProvidePlugin({
"window.SQL": "sql.js/dist/sql-wasm.js",
}),
];
return config;
},
// ... |
|
Thanks for sharing, I've just tried this config in my project and still same result: /** @type {import('next').NextConfig} */
const nextConfig = {
reactStrictMode: true,
experimental: {
appDir: true,
},
webpack: (config, { isServer, webpack }) => {
if (!isServer) {
config.resolve.fallback = {
...config.resolve.fallback,
fs: false,
crypto: false,
path: false,
"react-native-sqlite-storage": false,
"aws-sdk": false
};
config.plugins = [
...config.plugins,
new webpack.NormalModuleReplacementPlugin(/typeorm$/, function (result) {
result.request = result.request.replace(/typeorm/, "typeorm/browser");
}),
];
}
return config;
},
}
module.exports = nextConfig |
|
I'm seeing a similar issue with a Nuxt.js frontend: ERROR in ../node_modules/.pnpm/typeorm@0.3.15/node_modules/typeorm/browser/driver/mongodb/bson.typings.js
Module parse failed: Export 'BSON' is not defined (1:9)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
> export { BSON };
|
| //# sourceMappingURL=bson.typings.js.map
@ ../node_modules/.pnpm/typeorm@0.3.15/node_modules/typeorm/browser/driver/mongodb/typings.js 1:0-188 3:0-18 4:0-16 5:0-22 6:0-22 7:0-20 8:0-16 10:0-17 11:0-22 12:0-23 13:0-18 14:0-17 15:0-16 16:0-18 20:0-18 21:0-20 22:0-21 23:0-21
@ ../node_modules/.pnpm/typeorm@0.3.15/node_modules/typeorm/browser/index.jsEDIT Downgrading to the previous version resolves the issue. |
|
I've tried to downgrade to 0.3.14 but I still get the same error in Next.js app 🤔 @spotykatch anything you would like me to test? How can I help? |
|
Ohh you're right @franzos, some dependencies caching issue. Got it working now so confirming that |
Issue description
Trying to import DataSource in a NextJS client component breaks with BSON typing import
Expected Behavior
To be able to import the datasource without issues
Actual Behavior
Fails with:
Steps to reproduce
yarn create next-appyarn add typeormsrc/app/page.tsxand add the following:No need to call the function. This gives the following error:
My Environment
package.jsonnode version: 16.17.0
Additional Context
Seems someone else is getting this issue: https://stackoverflow.com/questions/76025976/typeorm-throws-a-bson-error-in-next-js-app
I'm not selecting any specific driver coz even though I'm trying to use sqljs, the driver failing is the mongo one.
Relevant Database Driver(s)
Are you willing to resolve this issue by submitting a Pull Request?
Yes, I have the time, but I don't know how to start. I would need guidance.
The text was updated successfully, but these errors were encountered: