mintme-web/next.config.mjs at main · mintme-dev/mintme-web · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
// next.config.mjs

// Importamos webpack directamente
import webpack from 'webpack';
import path from 'path';

let userConfig = undefined
try {
  // try to import ESM first
  userConfig = await import('./v0-user-next.config.mjs')
} catch (e) {
  try {
    // fallback to CJS import
    userConfig = await import("./v0-user-next.config");
  } catch (innerError) {
    // ignore error
  }
}

/** @type {import('next').NextConfig} */
const nextConfig = {
  eslint: {
    ignoreDuringBuilds: true,
  },
  typescript: {
    ignoreBuildErrors: true,
  },
  images: {
    unoptimized: true,
  },
  experimental: {
    webpackBuildWorker: true,
    parallelServerBuildTraces: true,
    parallelServerCompiles: true,
  },
  // Añadimos todas las bibliotecas de Solana a transpilePackages
  transpilePackages: [
    'mintme-widget',
    '@solana/web3.js',
    '@solana/wallet-adapter-base',
    '@solana/wallet-adapter-react',
    '@solana/wallet-adapter-react-ui',
    '@solana/wallet-adapter-wallets',
    'mintme-sdk'
  ],
  // Configuración de webpack para polyfills
  webpack: (config, { isServer }) => {
    // Si estamos en el servidor, marcamos las bibliotecas de Solana como externas
    if (isServer) {
      config.externals = [...(config.externals || []),
        '@solana/web3.js',
        '@solana/wallet-adapter-base',
        '@solana/wallet-adapter-react',
        '@solana/wallet-adapter-react-ui',
        '@solana/wallet-adapter-wallets',
        'mintme-sdk'
      ];
    }

    if (!isServer) {
      // En lugar de usar require.resolve, simplemente establecemos los módulos como false
      config.resolve.fallback = {
        fs: false,
        path: false,
        crypto: false,
        stream: false,
        os: false,
        buffer: false,
        // Añadimos pino-pretty a la lista de fallbacks
        'pino-pretty': false,
        net: false,
        tls: false,
        http: false,
        https: false,
        zlib: false,
        // Añadimos estos para Solana
        'crypto-browserify': false,
        'stream-browserify': false,
        'stream-http': false,
        'https-browserify': false,
        'browserify-zlib': false,
      };

      // Usamos webpack importado directamente en lugar de config.webpack
      config.plugins.push(
        new webpack.ProvidePlugin({
          Buffer: ['buffer', 'Buffer'],
          process: 'process/browser',
        }),
      );

      // Configuramos alias para pino-pretty si es necesario
      if (!config.resolve.alias) {
        config.resolve.alias = {};
      }

      // Opción 1: Establecer pino-pretty como false
      config.resolve.alias['pino-pretty'] = false;

      // Añadimos alias para bibliotecas problemáticas de Solana
      config.resolve.alias['@solana/web3.js'] = path.resolve('node_modules/@solana/web3.js');

      // Configuración para evitar errores de publicKey
      config.module = config.module || {};
      config.module.rules = config.module.rules || [];
      config.module.rules.push({
        test: /\.m?js$/,
        include: /node_modules/,
        type: 'javascript/auto',
        resolve: {
          fullySpecified: false,
        },
      });
    }

    // Si hay una configuración de webpack del usuario, aplicarla
    if (userConfig && userConfig.webpack) {
      return userConfig.webpack(config, { isServer });
    }

    return config;
  },
  // Desactivar el optimizador de React para evitar problemas con las bibliotecas de Solana
  reactStrictMode: false,
}

if (userConfig) {
  // ESM imports will have a "default" property
  const config = userConfig.default || userConfig

  for (const key in config) {
    // Manejo especial para webpack para preservar ambas configuraciones
    if (key === 'webpack' && typeof config.webpack === 'function') {
      const originalWebpack = nextConfig.webpack;
      nextConfig.webpack = (config, options) => {
        // Primero aplicamos nuestra configuración
        const updatedConfig = originalWebpack(config, options);
        // Luego aplicamos la configuración del usuario
        return config.webpack(updatedConfig, options);
      };
    }
    // Para otras configuraciones, mantener la lógica original
    else if (
      typeof nextConfig[key] === 'object' &&
      !Array.isArray(nextConfig[key])
    ) {
      nextConfig[key] = {
        ...nextConfig[key],
        ...config[key],
      }
    } else {
      nextConfig[key] = config[key]
    }
  }
}

export default nextConfig;