add prefix loader

Author: lobsterkatie

packages/nextjs/rollup.npm.config.js

@@ -29,4 +29,19 @@ export default [
       },
     }),
   ),
+  ...makeNPMConfigVariants(
+    makeBaseNPMConfig({
+      entrypoints: ['src/config/prefixLoader.ts'],
+
+      packageSpecificConfig: {
+        output: {
+          // make it so Rollup calms down about the fact that we're doing `export { loader as default }`
+          exports: 'default',
+
+          // preserve the original file structure (i.e., so that everything is still relative to `src`)
+          entryFileNames: 'config/[name].js',
+        },
+      },
+    }),
+  ),
 ];

packages/nextjs/src/config/prefixLoader.ts

@@ -0,0 +1,26 @@
+import * as fs from 'fs';
+import * as path from 'path';
+
+// TODO Use real webpack types (different for webpack 4 and 5?)
+type LoaderThis = {
+  getOptions: () => {
+    distDir: string;
+  };
+};
+
+/**
+ * Inject templated code into the beginning of a module.
+ */
+function prefixLoader(this: LoaderThis, userCode: string): string {
+  const { distDir } = this.getOptions();
+
+  const templatePath = path.resolve(__dirname, 'prefixLoaderTemplate.js');
+  let templateCode = fs.readFileSync(templatePath).toString();
+
+  // Fill in the placeholder
+  templateCode = templateCode.replace('__DIST_DIR__', distDir);
+
+  return `${templateCode}\n${userCode}`;
+}
+
+export { prefixLoader as default };