automatic merging of next.config.js files

.eslintrc.js

@@ -15,6 +15,7 @@ module.exports = {
     'assets/**',
     'scripts/**',
     'coverage/**',
+    'lib/Helper/test-fixtures/**',
   ],
   overrides: [
     {

CHANGELOG.md

@@ -1,12 +1,17 @@
 # Changelog
 
+## Unreleased
+
+- feat: Merge next.config.js files automatically (#222)
+
 ## 2.4.2
 
 - feat(nextjs): Add sentry.edge.config.js template (#227)
 
 ## 2.4.1
 
-- feat: Add logic to add @sentry/nextjs if it's missing when running the wizard (#219)
+- feat: Add logic to add @sentry/nextjs if it's missing when running the wizard
+  (#219)
 - fix: Print localhost with `http` instead of `https` (#212)
 - feat: Add project_platform as query param if -s and -i are set (#221)
 - feat: Add promo code option used for signup flows (#223)
@@ -22,12 +27,14 @@
 
 ## 2.3.1
 
-- fix(nextjs): Always check for both `next` and `@sentry/nextjs` presence and version (#209)
+- fix(nextjs): Always check for both `next` and `@sentry/nextjs` presence and
+  version (#209)
 - fix: `cli.executable` property should be resolved from cwd (#211)
 
 ## 2.3.0
 
-- feat(react-native): Xcode plugin debug files upload can include source using env
+- feat(react-native): Xcode plugin debug files upload can include source using
+  env
 - chore(ci): remove jira workflow (#204)
 
 ## 2.2.2
@@ -36,7 +43,8 @@
 
 ## 2.2.1
 
-- feat(nextjs): Add option to auto-wrap data fetchers and API routes to Next.js config (#194)
+- feat(nextjs): Add option to auto-wrap data fetchers and API routes to Next.js
+  config (#194)
 
 ## 2.2.0
 

lib/Helper/MergeConfig.ts

@@ -0,0 +1,18 @@
+import * as fs from 'fs';
+
+// merges the config files
+export function mergeConfigFile(
+  sourcePath: string,
+  templatePath: string,
+): boolean {
+  try {
+    const templateFile = fs.readFileSync(templatePath, 'utf8');
+    const sourceFile = fs.readFileSync(sourcePath, 'utf8');
+    const newText = templateFile.replace('// ORIGINAL CONFIG', sourceFile);
+    Function(newText); // check if the file is valid javascript
+    fs.writeFileSync(sourcePath, newText);
+    return true;
+  } catch (error) {
+    return false;
+  }
+}

lib/Helper/__tests__/MergeConfig.ts

@@ -0,0 +1,77 @@
+/// <reference types="jest" />
+import * as fs from 'fs';
+import * as path from 'path';
+
+import { mergeConfigFile } from '../MergeConfig';
+
+const configPath = path.join(__dirname, '..', 'test-fixtures/next.config.js');
+const templatePath = path.join(
+  __dirname,
+  '..',
+  '..',
+  '..',
+  'scripts/NextJS/configs/next.config.template.js',
+);
+
+function configFileNames(num: number): {
+  sourcePath: string;
+  mergedPath: string;
+} {
+  const sourcePath = path.join(
+    __dirname,
+    '..',
+    `test-fixtures/next.config.${num}.js`,
+  );
+  const mergedPath = path.join(
+    __dirname,
+    '..',
+    `test-fixtures/next.config.${num}-merged.js`,
+  );
+  return { sourcePath, mergedPath };
+}
+
+describe('Merging next.config.js', () => {
+  test('merge basic next.config.js', () => {
+    const { sourcePath, mergedPath } = configFileNames(1);
+    fs.copyFileSync(sourcePath, configPath);
+
+    expect(mergeConfigFile(configPath, templatePath)).toBe(true);
+    expect(
+      fs.readFileSync(configPath, 'utf8') ===
+        fs.readFileSync(mergedPath, 'utf8'),
+    ).toBe(true);
+    fs.unlinkSync(configPath);
+  });
+
+  test('merge invalid javascript config', () => {
+    const { sourcePath } = configFileNames(2);
+    fs.copyFileSync(sourcePath, configPath);
+
+    expect(mergeConfigFile(configPath, templatePath)).toBe(false);
+    fs.unlinkSync(configPath);
+  });
+
+  test('merge more complicated next.config.js', () => {
+    const { sourcePath, mergedPath } = configFileNames(3);
+    fs.copyFileSync(sourcePath, configPath);
+
+    expect(mergeConfigFile(configPath, templatePath)).toBe(true);
+    expect(
+      fs.readFileSync(configPath, 'utf8') ===
+        fs.readFileSync(mergedPath, 'utf8'),
+    ).toBe(true);
+    fs.unlinkSync(configPath);
+  });
+
+  test('merge next.config.js with function', () => {
+    const { sourcePath, mergedPath } = configFileNames(4);
+    fs.copyFileSync(sourcePath, configPath);
+
+    expect(mergeConfigFile(configPath, templatePath)).toBe(true);
+    expect(
+      fs.readFileSync(configPath, 'utf8') ===
+        fs.readFileSync(mergedPath, 'utf8'),
+    ).toBe(true);
+    fs.unlinkSync(configPath);
+  });
+});

lib/Helper/test-fixtures/next.config.1-merged.js

@@ -0,0 +1,18 @@
+// This file sets a custom webpack configuration to use your Next.js app
+// with Sentry.
+// https://nextjs.org/docs/api-reference/next.config.js/introduction
+// https://docs.sentry.io/platforms/javascript/guides/nextjs/manual-setup/
+const { withSentryConfig } = require('@sentry/nextjs');
+
+/** @type {import('next').NextConfig} */
+const nextConfig = {
+  reactStrictMode: true,
+};
+
+module.exports = nextConfig;
+
+module.exports = withSentryConfig(
+  module.exports,
+  { silent: true },
+  { hideSourcemaps: true },
+);

lib/Helper/test-fixtures/next.config.1.js

@@ -0,0 +1,6 @@
+/** @type {import('next').NextConfig} */
+const nextConfig = {
+  reactStrictMode: true,
+};
+
+module.exports = nextConfig;

lib/Helper/test-fixtures/next.config.2.js

@@ -0,0 +1,8 @@
+/** @type {import('next').NextConfig} */
+const nextConfig = {
+  reactStrictMode: true,
+
+
+
+
+module.exports = nextConfig;

lib/Helper/test-fixtures/next.config.3-merged.js

@@ -0,0 +1,21 @@
+// This file sets a custom webpack configuration to use your Next.js app
+// with Sentry.
+// https://nextjs.org/docs/api-reference/next.config.js/introduction
+// https://docs.sentry.io/platforms/javascript/guides/nextjs/manual-setup/
+const { withSentryConfig } = require('@sentry/nextjs');
+
+/** @type {import('next').NextConfig} */
+const nextConfig = {
+  reactStrictMode: true,
+  images: {
+    domains: [],
+  },
+};
+
+module.exports = nextConfig;
+
+module.exports = withSentryConfig(
+  module.exports,
+  { silent: true },
+  { hideSourcemaps: true },
+);

lib/Helper/test-fixtures/next.config.3.js

@@ -0,0 +1,9 @@
+/** @type {import('next').NextConfig} */
+const nextConfig = {
+  reactStrictMode: true,
+  images: {
+    domains: [],
+  },
+};
+
+module.exports = nextConfig;

lib/Helper/test-fixtures/next.config.4-merged.js

@@ -0,0 +1,21 @@
+// This file sets a custom webpack configuration to use your Next.js app
+// with Sentry.
+// https://nextjs.org/docs/api-reference/next.config.js/introduction
+// https://docs.sentry.io/platforms/javascript/guides/nextjs/manual-setup/
+const { withSentryConfig } = require('@sentry/nextjs');
+
+module.exports = (phase, { defaultConfig }) => {
+  /**
+   * @type {import('next').NextConfig}
+   */
+  const nextConfig = {
+    /* config options here */
+  };
+  return nextConfig;
+};
+
+module.exports = withSentryConfig(
+  module.exports,
+  { silent: true },
+  { hideSourcemaps: true },
+);

lib/Helper/test-fixtures/next.config.4.js

@@ -0,0 +1,9 @@
+module.exports = (phase, { defaultConfig }) => {
+  /**
+   * @type {import('next').NextConfig}
+   */
+  const nextConfig = {
+    /* config options here */
+  };
+  return nextConfig;
+};