chore(core): use typescript for next config

.changeset/twelve-tigers-swim.md

@@ -0,0 +1,5 @@
+---
+"@bigcommerce/catalyst-core": patch
+---
+
+use typescript for next config

core/lib/content-security-policy.js → core/lib/content-security-policy.ts

@@ -1,14 +1,13 @@
-// @ts-check
+import builder from 'content-security-policy-builder';
+
 const makeswiftEnabled = !!process.env.MAKESWIFT_SITE_API_KEY;
 
 const makeswiftBaseUrl = process.env.MAKESWIFT_BASE_URL || 'https://app.makeswift.com';
 
 const frameAncestors = makeswiftEnabled ? makeswiftBaseUrl : 'none';
 
-const builder = require('content-security-policy-builder');
-
 // customize the directives as needed
-const cspHeader = builder({
+export const cspHeader = builder({
   directives: {
     baseUri: ['self'],
     frameAncestors: [frameAncestors],
@@ -30,7 +29,3 @@ const cspHeader = builder({
     // reportUri: ['none'],
   },
 });
-
-module.exports = {
-  cspHeader,
-};

core/next.config.js → core/next.config.ts

@@ -1,12 +1,16 @@
-// @ts-check
-const createNextIntlPlugin = require('next-intl/plugin');
+/* eslint-disable @typescript-eslint/no-unsafe-return */
+/* eslint-disable @typescript-eslint/no-unsafe-member-access */
+/* eslint-disable @typescript-eslint/no-unsafe-call */
+import bundleAnalyzer from '@next/bundle-analyzer';
+import type { NextConfig } from 'next';
+import createNextIntlPlugin from 'next-intl/plugin';
+import { optimize } from 'webpack';
 
-const withNextIntl = createNextIntlPlugin();
+import { cspHeader } from './lib/content-security-policy';
 
-const { cspHeader } = require('./lib/content-security-policy');
+const withNextIntl = createNextIntlPlugin();
 
-/** @type {import('next').NextConfig} */
-let nextConfig = {
+let nextConfig: NextConfig = {
   reactStrictMode: true,
   experimental: {
     optimizePackageImports: ['@icons-pack/react-simple-icons'],
@@ -24,7 +28,9 @@ let nextConfig = {
         get() {
           return 'source-map';
         },
-        set() {},
+        set() {
+          // No empty
+        },
       });
     }
 
@@ -33,7 +39,7 @@ let nextConfig = {
     // Simply set the WEBPACK_MAX_CHUNKS environment variable to the desired number of chunks
     if (!isServer) {
       config.plugins.push(
-        new (require('webpack').optimize.LimitChunkCountPlugin)({
+        new optimize.LimitChunkCountPlugin({
           maxChunks: process.env.WEBPACK_MAX_CHUNKS
             ? parseInt(process.env.WEBPACK_MAX_CHUNKS, 10)
             : 50,
@@ -45,6 +51,8 @@ let nextConfig = {
   },
   // default URL generation in BigCommerce uses trailing slash
   trailingSlash: process.env.TRAILING_SLASH !== 'false',
+
+  // eslint-disable-next-line @typescript-eslint/require-await
   async headers() {
     return [
       {
@@ -68,9 +76,9 @@ let nextConfig = {
 nextConfig = withNextIntl(nextConfig);
 
 if (process.env.ANALYZE === 'true') {
-  const withBundleAnalyzer = require('@next/bundle-analyzer')();
+  const withBundleAnalyzer = bundleAnalyzer();
 
   nextConfig = withBundleAnalyzer(nextConfig);
 }
 
-module.exports = nextConfig;
+export default () => nextConfig;

core/package.json

@@ -15,6 +15,7 @@
   "dependencies": {
     "@bigcommerce/catalyst-client": "workspace:^",
     "@icons-pack/react-simple-icons": "^10.0.0",
+    "@next/bundle-analyzer": "15.0.2-canary.1",
     "@radix-ui/react-accordion": "^1.2.1",
     "@radix-ui/react-alert-dialog": "^1.1.2",
     "@radix-ui/react-checkbox": "^1.1.2",
@@ -65,7 +66,6 @@
     "@bigcommerce/eslint-config-catalyst": "workspace:^",
     "@faker-js/faker": "^9.0.3",
     "@gql.tada/cli-utils": "^1.6.3",
-    "@next/bundle-analyzer": "15.0.2-canary.1",
     "@playwright/test": "^1.48.0",
     "@tailwindcss/container-queries": "^0.1.1",
     "@types/gtag.js": "^0.0.20",