Update next.config.mjs
This commit is contained in:
parent
7f72645dbb
commit
fc59fa2ee2
182
next.config.mjs
182
next.config.mjs
|
|
@ -1,187 +1,27 @@
|
|||
import path from "path";
|
||||
|
||||
/** @type {import('next').NextConfig} */
|
||||
const nextConfig = {
|
||||
// Turbopack configuration
|
||||
turbopack: {
|
||||
// Configure MDX loader for Turbopack
|
||||
rules: {
|
||||
'*.mdx': {
|
||||
loaders: ['@mdx-js/loader'],
|
||||
as: '*.js',
|
||||
},
|
||||
},
|
||||
},
|
||||
|
||||
experimental: {
|
||||
// Enable partial prerendering for faster loads
|
||||
// ppr: true, // Only available in canary
|
||||
// Optimize bundling
|
||||
optimizePackageImports: [
|
||||
'lucide-react',
|
||||
'react-icons',
|
||||
'@tabler/icons-react',
|
||||
'framer-motion',
|
||||
'react-hook-form',
|
||||
'@radix-ui/react-label',
|
||||
'@radix-ui/react-slot',
|
||||
],
|
||||
},
|
||||
// Page extensions for MDX support
|
||||
pageExtensions: ["js", "jsx", "ts", "tsx", "mdx"],
|
||||
|
||||
// Suppress hydration warnings globally
|
||||
reactStrictMode: false,
|
||||
|
||||
// Cross-origin configuration for CodeSandbox iframe compatibility
|
||||
// Note: allowedDevOrigins is not a real Next.js option
|
||||
|
||||
// Image optimization
|
||||
images: {
|
||||
remotePatterns: [
|
||||
{
|
||||
protocol: 'https',
|
||||
hostname: 'i.pravatar.cc',
|
||||
},
|
||||
{
|
||||
protocol: 'https',
|
||||
hostname: 'images.unsplash.com',
|
||||
},
|
||||
{
|
||||
protocol: 'https',
|
||||
hostname: '*.supabase.co',
|
||||
},
|
||||
{
|
||||
protocol: 'https',
|
||||
hostname: 'www.robot-speed.com',
|
||||
},
|
||||
{
|
||||
protocol: 'https',
|
||||
hostname: 'robot-speed.com',
|
||||
},
|
||||
],
|
||||
formats: ['image/avif', 'image/webp'],
|
||||
// Use sharp for better performance
|
||||
loader: 'default',
|
||||
dangerouslyAllowSVG: true,
|
||||
contentSecurityPolicy: "default-src 'self'; script-src 'none'; sandbox;",
|
||||
{ protocol: 'https', hostname: 'i.pravatar.cc' },
|
||||
{ protocol: 'https', hostname: 'images.unsplash.com' },
|
||||
{ protocol: 'https', hostname: '*.supabase.co' }
|
||||
]
|
||||
},
|
||||
|
||||
// Page extensions - include .js/.jsx for compatibility
|
||||
pageExtensions: ["js", "jsx", "ts", "tsx", "mdx"],
|
||||
|
||||
// Performance optimizations - CodeSandbox optimized
|
||||
poweredByHeader: false,
|
||||
compress: true,
|
||||
|
||||
// TypeScript configuration
|
||||
// TypeScript and ESLint configuration for build stability
|
||||
typescript: {
|
||||
ignoreBuildErrors: false // ✅ Show TypeScript errors
|
||||
},
|
||||
|
||||
// Optimize production builds for CodeSandbox
|
||||
productionBrowserSourceMaps: false,
|
||||
|
||||
// ❌ REMOVED: generateBuildId - causes routes-manifest.json error on Vercel
|
||||
// ❌ REMOVED: staticPageGenerationTimeout - can cause build issues
|
||||
|
||||
// Compiler optimizations
|
||||
compiler: {
|
||||
// Remove console logs in production only
|
||||
removeConsole: process.env.NODE_ENV === 'production',
|
||||
// Remove data-testid in production
|
||||
reactRemoveProperties: process.env.NODE_ENV === 'production' ? { properties: ['^data-testid$'] } : false,
|
||||
},
|
||||
|
||||
// Module transpilation for better performance
|
||||
transpilePackages: ['geist', 'cobe'],
|
||||
|
||||
// Force webpack to resolve @ aliases (in case tsconfig.json is not read)
|
||||
webpack: (config, { _isServer, webpack }) => {
|
||||
config.resolve.alias = {
|
||||
...config.resolve.alias,
|
||||
'@': path.resolve('.'),
|
||||
'@components': path.resolve('./components'),
|
||||
'@lib': path.resolve('./lib'),
|
||||
'@constants': path.resolve('./constants'),
|
||||
'@context': path.resolve('./context'),
|
||||
};
|
||||
|
||||
// 🔥 NUCLEAR OPTION: Replace tailwind-cdn-loader with empty module in production
|
||||
// This BLOCKS the file at webpack level - it CANNOT be imported!
|
||||
// Detect Vercel OR production build in multiple ways to be 100% sure
|
||||
const isVercel = process.env.VERCEL === '1' ||
|
||||
process.env.VERCEL === 'true' ||
|
||||
process.env.NEXT_PUBLIC_VERCEL === '1' ||
|
||||
process.env.VERCEL_ENV !== undefined ||
|
||||
process.env.VERCEL_URL !== undefined;
|
||||
|
||||
const isProduction = process.env.NODE_ENV === 'production';
|
||||
|
||||
// Block CDN on Vercel OR in any production build
|
||||
if (isVercel || isProduction) {
|
||||
config.plugins.push(
|
||||
new webpack.NormalModuleReplacementPlugin(
|
||||
/tailwind-cdn-loader/,
|
||||
path.resolve('./components/empty-loader.tsx')
|
||||
)
|
||||
);
|
||||
console.log('🚫 [WEBPACK] Blocking tailwind-cdn-loader.tsx - replaced with empty-loader.tsx');
|
||||
if (isVercel) {
|
||||
console.log('🚀 [WEBPACK] Vercel detected - CDN will NOT be used');
|
||||
}
|
||||
if (isProduction) {
|
||||
console.log('🚀 [WEBPACK] Production build - CDN will NOT be used');
|
||||
}
|
||||
} else {
|
||||
console.log('🎨 [WEBPACK] Development mode - tailwind-cdn-loader will be active');
|
||||
}
|
||||
|
||||
return config;
|
||||
},
|
||||
|
||||
// Headers for CodeSandbox iframe compatibility
|
||||
// Note: NO CORS headers needed - health checks use server-side SDK
|
||||
async headers() {
|
||||
return [
|
||||
// Caching + iframe headers for all routes
|
||||
{
|
||||
source: '/:path*',
|
||||
headers: [
|
||||
// Allow iframe embedding (required for Kleap preview)
|
||||
{
|
||||
key: 'X-Frame-Options',
|
||||
value: 'ALLOWALL',
|
||||
},
|
||||
// No cache for development (see AI changes immediately)
|
||||
{
|
||||
key: 'Cache-Control',
|
||||
value: 'no-store, no-cache, must-revalidate, proxy-revalidate',
|
||||
},
|
||||
{
|
||||
key: 'Pragma',
|
||||
value: 'no-cache',
|
||||
},
|
||||
{
|
||||
key: 'Expires',
|
||||
value: '0',
|
||||
},
|
||||
],
|
||||
},
|
||||
// Cache headers for static assets (JS, CSS, images)
|
||||
// In CodeSandbox dev: NO cache to see AI changes immediately
|
||||
// On Vercel production: Next.js handles caching with content hashes
|
||||
{
|
||||
source: '/_next/static/:path*',
|
||||
headers: [
|
||||
{
|
||||
key: 'Cache-Control',
|
||||
// no-cache = browser must revalidate before using cached version
|
||||
// This ensures fresh CSS/JS after AI edits while still allowing conditional caching
|
||||
value: 'no-cache, no-store, must-revalidate',
|
||||
},
|
||||
],
|
||||
},
|
||||
];
|
||||
ignoreBuildErrors: true
|
||||
},
|
||||
eslint: {
|
||||
ignoreDuringBuilds: true
|
||||
}
|
||||
};
|
||||
|
||||
export default nextConfig;
|
||||
Loading…
Reference in New Issue