portfolio/next.config.js at main · slafleche/portfolio · 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
import { createVanillaExtractPlugin } from '@vanilla-extract/next-plugin';
import path from 'path';
import { fileURLToPath } from 'url';

import {
  getNodeEnv,
  getPublicMeasurementDebug,
  notRelease,
} from './envPrimitives.mjs';

const __filename = fileURLToPath(import.meta.url);
const __dirname = path.dirname(__filename);
const vanillaDebugLoaderPath = path.join(
  __dirname,
  'scripts',
  'vanillaDebugLoader.cjs',
);
const vanillaDebugTest = /\.css\.(ts|tsx|js|jsx|mjs|mts|cts)$/;

const withVanillaExtract = createVanillaExtractPlugin();

const getPublicVercelEnv = () => {
  const env = getNodeEnv();
  if (env === 'release') return 'production';
  if (env === 'staging') return 'preview';
  return 'development';
};

/** @type {import('next').NextConfig} */
const nextConfig = {
  env: {
    NEXT_PUBLIC_VERCEL_ENV: getPublicVercelEnv(),
    NEXT_PUBLIC_MEASUREMENT_DEBUG:
      getPublicMeasurementDebug() ??
      (notRelease() ? '1' : '0'),
  },
  devIndicators: {
    buildActivity: false,
    appIsrStatus: false,
  },
  async redirects() {
    return [
      {
        source: '/:path*',
        has: [
          {
            type: 'header',
            key: 'host',
            value: 'www.lafleche.dev',
          },
        ],
        destination: 'https://lafleche.dev/:path*',
        permanent: true,
      },
    ];
  },
  webpack(config) {
    config.resolve.alias = {
      ...(config.resolve.alias ?? {}),
    };

    if (
      !config.module.rules.some(
        (rule) =>
          Array.isArray(rule?.use) &&
          rule.use.some(
            (loader) =>
              typeof loader === 'object' &&
              loader?.loader === vanillaDebugLoaderPath,
          ),
      )
    ) {
      config.module.rules.unshift({
        test: vanillaDebugTest,
        enforce: 'pre',
        use: [
          {
            loader: vanillaDebugLoaderPath,
          },
        ],
      });
    }

    const svgrRule = {
      test: /\.svg$/i,
      issuer: /\.[jt]sx?$/,
      resourceQuery: {
        not: [
          /url/,
        ],
      }, // exclude *.svg?url
      use: [
        {
          loader: '@svgr/webpack',
          options: {
            svgo: true,
            titleProp: true,
            ref: true,
            typescript: true,
            memo: true,
          },
        },
      ],
    };

    // SVG as React component by default
    const oneOfRule = config.module.rules.find(
      (rule) => Array.isArray(rule?.oneOf),
    );
    if (oneOfRule) {
      oneOfRule.oneOf.unshift(svgrRule);
    } else {
      config.module.rules.push(svgrRule);
    }

    // Raw file URL when you add ?url
    config.module.rules.push({
      test: /\.svg$/i,
      resourceQuery: /url/,
      type: 'asset/resource',
    });

    // Allow importing markdown content as raw strings
    config.module.rules.push({
      test: /\.md$/i,
      type: 'asset/source',
    });

    return config;
  },
};

export default withVanillaExtract(nextConfig);