[code-infra] Move next config to ESM

.eslintrc.js

@@ -465,7 +465,7 @@ module.exports = {
       },
     },
     {
-      files: ['scripts/**/*.mjs', 'packages/**/*.mjs'],
+      files: ['**/*.mjs'],
       rules: {
         'import/extensions': ['error', 'ignorePackages'],
       },

docs/next.config.js → docs/next.config.mjs

@@ -1,26 +1,33 @@
 // @ts-check
-const path = require('path');
-// @ts-ignore
-const { BundleAnalyzerPlugin } = require('webpack-bundle-analyzer');
-const pkg = require('../package.json');
-const withDocsInfra = require('./nextConfigDocsInfra');
-const { findPages } = require('./src/modules/utils/find');
-const {
+import * as path from 'path';
+import * as url from 'url';
+import * as fs from 'fs';
+import { BundleAnalyzerPlugin } from 'webpack-bundle-analyzer';
+import { createRequire } from 'module';
+import withDocsInfra from './nextConfigDocsInfra.js';
+import { findPages } from './src/modules/utils/find.mjs';
+import {
   LANGUAGES,
   LANGUAGES_SSR,
   LANGUAGES_IGNORE_PAGES,
   LANGUAGES_IN_PROGRESS,
-} = require('./config');
+} from './config.js';
 
-const workspaceRoot = path.join(__dirname, '../');
+const currentDirectory = url.fileURLToPath(new URL('.', import.meta.url));
+const require = createRequire(import.meta.url);
+
+const workspaceRoot = path.join(currentDirectory, '../');
 
 const l10nPRInNetlify = /^l10n_/.test(process.env.HEAD || '') && process.env.NETLIFY === 'true';
 const vercelDeploy = Boolean(process.env.VERCEL);
 const isDeployPreview = Boolean(process.env.PULL_REQUEST_ID);
 // For crowdin PRs we want to build all locales for testing.
 const buildOnlyEnglishLocale = isDeployPreview && !l10nPRInNetlify && !vercelDeploy;
 
-module.exports = withDocsInfra({
+const pkgContent = fs.readFileSync(path.resolve(workspaceRoot, 'package.json'), 'utf8');
+const pkg = JSON.parse(pkgContent);
+
+export default withDocsInfra({
   webpack: (config, options) => {
     const plugins = config.plugins.slice();
 

docs/package.json

@@ -132,6 +132,7 @@
     "@types/react-transition-group": "^4.4.10",
     "@types/react-window": "^1.8.8",
     "@types/stylis": "^4.2.0",
+    "@types/webpack-bundle-analyzer": "^4.6.3",
     "chai": "^4.4.1",
     "cross-fetch": "^4.0.0",
     "gm": "^1.25.0",

docs/src/modules/utils/find.js → docs/src/modules/utils/find.mjs

@@ -1,5 +1,8 @@
-const fs = require('fs');
-const path = require('path');
+import * as fs from 'fs';
+import * as url from 'url';
+import * as path from 'path';
+
+const currentDirectory = url.fileURLToPath(new URL('.', import.meta.url));
 
 const pageRegex = /(\.js|\.tsx)$/;
 const blackList = ['/.eslintrc', '/_document', '/_app'];
@@ -19,9 +22,10 @@ const blackList = ['/.eslintrc', '/_document', '/_app'];
  * @param {NextJSPage[]} pages
  * @returns {NextJSPage[]}
  */
-function findPages(
+// eslint-disable-next-line import/prefer-default-export
+export function findPages(
   options = {},
-  directory = path.resolve(__dirname, '../../../pages'),
+  directory = path.resolve(currentDirectory, '../../../pages'),
   pages = [],
 ) {
   fs.readdirSync(directory).forEach((item) => {
@@ -80,7 +84,3 @@ function findPages(
 
   return pages;
 }
-
-module.exports = {
-  findPages,
-};

docs/tsconfig.json

@@ -1,6 +1,6 @@
 {
   "extends": "../tsconfig.json",
-  "include": ["next-env.d.ts", "types", "src", "pages", "data", "next.config.js"],
+  "include": ["next-env.d.ts", "types", "src", "pages", "data", "next.config.mjs"],
   "compilerOptions": {
     "allowJs": true,
     "isolatedModules": true,