Skip to content

Fix: Testing updated Output File Tracing in NextJS for CDN usage #14180

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
wants to merge 8 commits into from
Closed

Fix: Testing updated Output File Tracing in NextJS for CDN usage #14180

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
8 commits
Select commit Hold shift + click to select a range
303d548
updating outputFileTracingExcludes for testing
codyde Jun 26, 2025
d106baa
Removing next Image component as a test
codyde Jun 26, 2025
692cd8d
Comment out the Next.js Image component in docImage.tsx for testing p…
codyde Jun 26, 2025
768d2a2
[getsentry/action-github-commit] Auto commit
getsantry[bot] Jun 26, 2025
cc59bf5
Refactor image source handling in DocImage component to improve path …
codyde Jun 26, 2025
cb3f41a
Merge branch 'fix-correcting-outputFileTracingExcludes-for-serverless…
codyde Jun 26, 2025
aabda21
Removing path for testing
codyde Jun 26, 2025
d9446c1
[getsentry/action-github-commit] Auto commit
getsantry[bot] Jun 26, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
97 changes: 78 additions & 19 deletions next.config.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,27 +1,86 @@
import {codecovNextJSWebpackPlugin} from '@codecov/nextjs-webpack-plugin';
import {withSentryConfig} from '@sentry/nextjs';
import { codecovNextJSWebpackPlugin } from '@codecov/nextjs-webpack-plugin';
import { withSentryConfig } from '@sentry/nextjs';

import {redirects} from './redirects.js';
import { redirects } from './redirects.js';

const outputFileTracingExcludes = process.env.NEXT_PUBLIC_DEVELOPER_DOCS
? {
'/**/*': ['./.git/**/*', './apps/**/*', 'docs/**/*'],
}
'/**/*': [
'./.git/**/*',
'./apps/**/*',
'docs/**/*',
// Add image exclusions for dev docs too
'public/mdx-images/**/*',
'**/*.png',
'**/*.jpg',
'**/*.jpeg',
'**/*.gif',
'**/*.svg',
'**/*.webp',
'**/*.pdf'
],
}
: {
'/**/*': [
'./.git/**/*',
'./apps/**/*',
'develop-docs/**/*',
'node_modules/@esbuild/darwin-arm64',
],
'/platform-redirect': ['**/*.gif', 'public/mdx-images/**/*', '*.pdf'],
'\\[\\[\\.\\.\\.path\\]\\]': [
'docs/**/*',
'node_modules/prettier/plugins',
'node_modules/rollup/dist',
],
'sitemap.xml': ['docs/**/*', 'public/mdx-images/**/*', '*.gif', '*.pdf', '*.png'],
};
'/**/*': [
'./.git/**/*',
'./apps/**/*',
'develop-docs/**/*',
'node_modules/@esbuild/darwin-arm64',
// CRITICAL: Add comprehensive image exclusions globally
'public/mdx-images/**/*',
'public/**/*.png',
'public/**/*.jpg',
'public/**/*.jpeg',
'public/**/*.gif',
'public/**/*.svg',
'public/**/*.webp',
'public/**/*.pdf',
// Exclude large dependencies that shouldn't be in functions
'node_modules/@google-cloud/**/*',
'node_modules/@aws-sdk/**/*',
'node_modules/sharp/**/*',
'node_modules/mermaid/**/*',
],
'/platform-redirect': ['**/*.gif', 'public/mdx-images/**/*', '*.pdf'],
'/[[...path]]': [
'docs/**/*',
'node_modules/prettier/plugins',
'node_modules/rollup/dist',
// CRITICAL: Add image exclusions for main docs route
'public/mdx-images/**/*',
'**/*.gif',
'**/*.png',
'**/*.jpg',
'**/*.jpeg',
'**/*.pdf',
'**/*.svg',
'**/*.webp',
// Exclude heavy deps from main route
'node_modules/@google-cloud/**/*',
'node_modules/@aws-sdk/**/*',
'node_modules/sharp/**/*',
'node_modules/mermaid/**/*',
],
// Fallback pattern in case Next.js uses different internal naming
'[[...path]]': [
'docs/**/*',
'public/mdx-images/**/*',
'**/*.gif',
'**/*.png',
'**/*.jpg',
'**/*.jpeg',
'**/*.pdf',
'**/*.svg',
'**/*.webp',
'node_modules/prettier/plugins',
'node_modules/rollup/dist',
'node_modules/@google-cloud/**/*',
'node_modules/@aws-sdk/**/*',
'node_modules/sharp/**/*',
'node_modules/mermaid/**/*',
],
'sitemap.xml': ['docs/**/*', 'public/mdx-images/**/*', '*.gif', '*.pdf', '*.png', '**/*.jpg', '**/*.jpeg'],
};

if (
process.env.NODE_ENV !== 'development' &&
Expand Down
12 changes: 7 additions & 5 deletions src/components/docImage.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,6 @@
import path from 'path';

import Image from 'next/image';
// import path from 'path';

// import Image from 'next/image';
import {serverContext} from 'sentry-docs/serverContext';

export default function DocImage({
Expand All @@ -24,7 +23,7 @@
// If the image src is not an absolute URL, we assume it's a relative path
// and we prepend /mdx-images/ to it.
if (src.startsWith('./')) {
src = path.join('/mdx-images', src);
src = '/mdx-images/' + src.slice(2); // Remove './' and prepend '/mdx-images/'
}
// account for the old way of doing things where the public folder structure mirrored the docs folder
else if (!src?.startsWith('/') && !src?.includes('://')) {
Expand All @@ -34,14 +33,17 @@
// parse the size from the URL hash (set by remark-image-size.js)
const srcURL = new URL(src, 'https://example.com');
const imgPath = srcURL.pathname;

// Debug: log the final URL (remove this after testing)
console.log('DocImage - Final src:', src, 'imgPath:', imgPath);

Check warning on line 38 in src/components/docImage.tsx

View workflow job for this annotation

GitHub Actions / Lint 

Unexpected console statement
const [width, height] = srcURL.hash // #wxh
.slice(1)
.split('x')
.map(s => parseInt(s, 10));

return (
<a href={imgPath} target="_blank" rel="noreferrer">
<Image
<img

Check warning on line 46 in src/components/docImage.tsx

View workflow job for this annotation

GitHub Actions / Lint 

Using `<img>` could result in slower LCP and higher bandwidth. Consider using `<Image />` from `next/image` to automatically optimize images. This may incur additional usage or cost from your provider. See: https://nextjs.org/docs/messages/no-img-element
{...props}
src={src}
width={width}
Expand Down
Loading