Comments (14)
Is there any updates or implementations on how to use rollbar in nextjs app router?
from rollbar.js.
yeah, in that case, error.js component will be shown. For some cases, we want to catch errors on the server side components and do nothing but report errors...
from rollbar.js.
Facing the same issue after migration to NextJs 13.4 as @Musashi-Sakamoto, catching an error on the server but still want to send the error to rollbar.
Did we have any updates on this? How can I get it working?
from rollbar.js.
Hey @Musashi-Sakamoto, Thanks for reporting this issue. You can find a Next.js instruction in the Rollbar documentation. Can you check it out to see if it solves your problem?
from rollbar.js.
@rollbar-bborsits Thank you for getting back to me quickly. The document seems a bit outdated. I doubt Next13 works with things like getInitialProps
, _error.js
.
from rollbar.js.
@Musashi-Sakamoto I have just tested this on 13.4.4, using the pattern in your example to setup Rollbar. I tested both js and ts, but didn't get an error. I'm using the default tsconfig generated by next build
.
If I do force an error, the output provides a stack trace with the error. May try next build --debug
and see if it provides more context?
from rollbar.js.
@waltjones
It doesn't provide any useful error with --debug
option. Also, I tested with a new project created with create-next-app
with tailwindcss option and it still happens.
I am using v16.15.0 if it helps
yarn run v1.22.19
$ next build --debug
- info Loaded env from /Users/sakamotomusashi/work/invoice-simple/demo2/.env.production
- info Downloading WASM swc package...
- info Using wasm build of next-swc
- warn Attempted to load @next/swc-darwin-x64, but it was not installed
- info Creating an optimized production build
- info Compiled successfully
- info Linting and checking validity of types
- info Collecting page data ..TypeError: Cannot set properties of undefined (setting 'is')
at Object.<anonymous> (/Users/sakamotomusashi/work/invoice-simple/demo2/.next/server/chunks/879.js:10853:28)
at /Users/sakamotomusashi/work/invoice-simple/demo2/.next/server/chunks/879.js:10854:12
at 457 (/Users/sakamotomusashi/work/invoice-simple/demo2/.next/server/chunks/879.js:10857:3)
at __webpack_require__ (/Users/sakamotomusashi/work/invoice-simple/demo2/.next/server/webpack-runtime.js:25:43)
at 8152 (/Users/sakamotomusashi/work/invoice-simple/demo2/.next/server/chunks/879.js:16436:12)
at __webpack_require__ (/Users/sakamotomusashi/work/invoice-simple/demo2/.next/server/webpack-runtime.js:25:43)
at 9882 (/Users/sakamotomusashi/work/invoice-simple/demo2/.next/server/chunks/879.js:19219:17)
at __webpack_require__ (/Users/sakamotomusashi/work/invoice-simple/demo2/.next/server/webpack-runtime.js:25:43)
at 5029 (/Users/sakamotomusashi/work/invoice-simple/demo2/.next/server/chunks/879.js:18185:18)
at __webpack_require__ (/Users/sakamotomusashi/work/invoice-simple/demo2/.next/server/webpack-runtime.js:25:43)
> Build error occurred
Error: Failed to collect page data for /
at /Users/sakamotomusashi/work/invoice-simple/demo2/node_modules/next/dist/build/utils.js:1152:15
at process.processTicksAndRejections (node:internal/process/task_queues:95:5) {
type: 'Error'
}
error Command failed with exit code 1.
from rollbar.js.
Is there any updates on this? I'm having the same problem with Next 13.4.5. After some debugging, I discovered that the error is thrown when the rollbar instance is created.
from rollbar.js.
Okay, I have resolved it. I forgot to use the 'use client' directive. So any component that uses a rollbar instance should be marked with use client
directive in order to enable the associated javascript to be bundled and run on the client side; otherwise, you will face issues on the client side.
from rollbar.js.
yeah, but that means you can't report error on server side components
from rollbar.js.
Yes, currently, I don't report errors on the server component. According to the Next13 app router documentation, any server errors are serialized and sent to the nearest error.js component (the sent error is digested for security reasons). So, I make the report there inside the useEffect. However, I'm still trying to figure out the proper way to interpret the digested/hashed error inside Rollbar.
from rollbar.js.
That's an excellent point. I haven't come up with a solution for that, at least not from the Next.js error handling perspective. I'm not sure if it's possible to make the Rollbar provider work on the server as well.
from rollbar.js.
I was able to install rollbar and use it on server component. not sure why it worked this time..
from rollbar.js.
@Musashi-Sakamoto Which version of Nextjs and Rollbar did it work with?
from rollbar.js.
Related Issues (20)
- RollbarJSON.parse is not a function (AWS Lambda) HOT 1
- NodeJS - silence exit when enabled is false and captureUncaught is true
- rollbar Vulnerability - CVE-2020-26302 HOT 1
- Configuration for `checkIgnore` does not work HOT 1
- autoInstrument is broken with got library HOT 5
- Does rollbar.js support Deno? HOT 4
- Test issue HOT 4
- Nodemon no longer show error message when Rollbar is initialized. HOT 1
- ErrorBoundary props for TS HOT 3
- Deno support - does Rollbar need to read files outside of current directory? HOT 3
- Listing items HOT 1
- is_js vulnerable to Regular Expression Denial of Service HOT 1
- enabled configuration option is ignored
- Rollbar in Vue app causes freeze / 100% CPU usage (inf. recursion) HOT 5
- TypeError when console.log a dynamic Imports
- Error with Rollbar Integration on Cloudflare Workers: "addEventListener(): useCapture must be false." HOT 1
- Rollbar.prototype.wait() for browser envrironment
- ignoredMessages not getting ignored HOT 2
- Rollbar: Unexpected Rollbar.loadFull() called on a Notifier instance.
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from rollbar.js.