Dropping the webpack plugin

Author: jamesdaniels

package-lock.json

@@ -22,7 +22,7 @@
   ],
   "sideEffects": false,
   "scripts": {
-    "build": "rm -rf dist && tsc -p tsconfig.client.json && tsc && ts-node ./tools/build.ts",
+    "build": "rm -rf dist && tsc && ts-node ./tools/build.ts",
     "dev": "npm run build && ts-node ./tools/dev.ts",
     "test": "echo \"Error: no test specified\" && exit 1",
     "e2e:build-next": "rm -rf e2e && npx create-next-app e2e --use-npm --ts",
@@ -63,8 +63,7 @@
     "fs-extra": "^10.1.0",
     "jsonc-parser": "^3.0.0",
     "semver": "^7.3.7",
-    "tslib": "^2.3.1",
-    "firebase": "^9.8.1"
+    "tslib": "^2.3.1"
   },
   "devDependencies": {
     "@angular-devkit/architect": "^0.1303.3",
@@ -77,6 +76,7 @@
     "@types/node": "^16.11.12",
     "@types/semver": "^7.3.9",
     "cookie": "^0.5.0",
+    "firebase": "^9.8.1",
     "firebase-admin": "^10.1.0",
     "firebase-functions": "^3.20.1",
     "firebase-tools": "^10.5.0",

package.json

@@ -1,16 +1,10 @@
-export * from 'firebase/auth';
 import {
     beforeAuthStateChanged,
     onIdTokenChanged,
-    getAuth as getFirebaseAuth,
-    initializeAuth as initializeFirebaseAuth,
     User,
     Auth,
-    Dependencies
 } from 'firebase/auth';
-import type { FirebaseApp } from 'firebase/app';
-
-export const ID_TOKEN_MAX_AGE = 5 * 60;
+import { ID_TOKEN_MAX_AGE } from '../../constants';
 
 let alreadySetup = false;
 let lastPostedIdToken: string|undefined|null = null;
@@ -31,7 +25,7 @@ const mintCookie = async (user: User|null) => {
     });
 };
 
-const setup = (auth: Auth) => {
+export const initializeClient = (auth: Auth) => {
     if (auth.app.name !== '[DEFAULT]') return;
     if (typeof window === 'undefined') return;
     if (alreadySetup) return;
@@ -41,15 +35,3 @@ const setup = (auth: Auth) => {
     });
     onIdTokenChanged(auth, user => mintCookie(user));
 }
-
-export function getAuth(app?: FirebaseApp) {
-    const auth = getFirebaseAuth(app);
-    setup(auth);
-    return auth;
-}
-
-export function initializeAuth(app: FirebaseApp, deps?: Dependencies) {
-    const auth = initializeFirebaseAuth(app, deps);
-    setup(auth);
-    return auth;
-}

src/client/auth/index.ts

@@ -1,4 +1,3 @@
-export { ID_TOKEN_MAX_AGE } from './client/auth';
 export const FIREBASE_ADMIN_VERSION = '__FIREBASE_ADMIN_VERSION__';
 export const FIREBASE_FUNCTIONS_VERSION = '__FIREBASE_FUNCTIONS_VERSION__';
 export const COOKIE_VERSION = '__COOKIE_VERSION__';
@@ -8,4 +7,4 @@ export const DEFAULT_REGION = 'us-central1';
 export const LRU_MAX_INSTANCES = 100;
 export const LRU_TTL = 1_000 * 60 * 5;
 export const COOKIE_MAX_AGE = 60 * 60 * 24 * 5 * 1_000;
-export const MIN_FIREBASE_SDK_FOR_AUTH = '9.8.0';
+export const ID_TOKEN_MAX_AGE = 5 * 60;

src/constants.ts

@@ -21,7 +21,7 @@ import nextExport from 'next/dist/export';
 import { copy } from 'fs-extra';
 import { trace } from 'next/dist/trace';
 
-import { DeployConfig, PathFactory, findDependency, getWebpackPlugin } from '../../utils';
+import { DeployConfig, PathFactory } from '../../utils';
 
 export const build = async (config: DeployConfig | Required<DeployConfig>, getProjectPath: PathFactory) => {
 
@@ -35,32 +35,14 @@ export const build = async (config: DeployConfig | Required<DeployConfig>, getPr
         nextConfig = await import(getProjectPath('next.config.js'));
     }
 
-    let usesFirebaseConfig = false;
-    const firebaseDependency = findDependency('firebase', getProjectPath());
-    let overrideConfig: NextConfig|null = null;
-    if (firebaseDependency) {
-        overrideConfig = {
-            ...nextConfig,
-            webpack: (config, context) => {
-                let newConfig = config;
-                if (nextConfig.webpack) newConfig = nextConfig.webpack(config, context);
-                if (context.isServer) return newConfig;
-                const plugin = getWebpackPlugin(context.webpack, getProjectPath());
-                newConfig.plugins ||= [];
-                newConfig.plugins.push(plugin);
-                return newConfig;
-            }
-        }
-    }
-
 
     // SEMVER these defaults are only needed for Next 11
     const { distDir='.next', basePath='' } = nextConfig;
 
     const deployPath = (...args: string[]) => config.dist ? join(config.dist, ...args) : getProjectPath('.deploy', ...args);
     const getHostingPath = (...args: string[]) => deployPath('hosting', ...basePath.split('/'), ...args);
 
-    await nextBuild(getProjectPath(), overrideConfig as any, false, false, true);
+    await nextBuild(getProjectPath(), null, false, false, true);
 
     console.log('Attempting `next export`...');
 
@@ -69,7 +51,7 @@ export const build = async (config: DeployConfig | Required<DeployConfig>, getPr
         { silent: true, outdir: getHostingPath() },
         trace('next-export-cli')
     ).catch(() => {
-        console.warn('\nIgnore the above error, Next.js is not respecting the silent flag. Since next export did not succeed we\'ll treat as SSR.\n\n');
+        console.warn('\nYou can safely ignore the above error. Since next export did not succeed we\'ll treat as SSR.\n\n');
     });
 
     let usingCloudFunctions = !!config.function;
@@ -149,7 +131,7 @@ export const build = async (config: DeployConfig | Required<DeployConfig>, getPr
     }).filter(it => it);
 
     // TODO use this better detection for usesFirebaseConfig
-    return { usingCloudFunctions, usesFirebaseConfig, headers, redirects, rewrites, framework: 'next.js', packageJson, bootstrapScript: null };
+    return { usingCloudFunctions, headers, redirects, rewrites, framework: 'next.js', packageJson, bootstrapScript: null };
 }
 
 type Manifest = {

src/frameworks/next.js/index.ts

@@ -13,9 +13,7 @@
 // limitations under the License.
 
 import { exec as execCallback, spawn as spawnCallback, ExecOptions, SpawnOptionsWithoutStdio, spawnSync } from 'child_process';
-import { dirname, join, relative, resolve, sep } from 'path';
-import { lt } from 'semver';
-import { MIN_FIREBASE_SDK_FOR_AUTH } from './constants';
+import { join } from 'path';
 
 export const exec = (command: string, options: ExecOptions={}) => new Promise((resolve, reject) =>
     execCallback(command, options, (error, stdout) => {
@@ -76,22 +74,4 @@ export const findDependency = (name: string, cwd=process.cwd()) => {
         return null;
     }
     return search(name, json.dependencies);
-}
-
-export const getWebpackPlugin = (webpack: typeof import('webpack'), cwd: string) => {
-    const { NormalModuleReplacementPlugin } = webpack;
-    return new NormalModuleReplacementPlugin(/^firebase\/(auth)$/, (resource: any) => {
-        // Don't allow firebase-frameworks to recurse
-        const frameworksRoot = resolve(`${dirname(require.resolve('.'))}${sep}..`);
-        if (resource.context.startsWith(frameworksRoot)) return;
-        // Don't mutate their node_modules
-        if (relative(cwd, resource.context).startsWith(`node_modules${sep}`)) return;
-        const client = resource.request.split('firebase/')[1];
-        const firebaseDependency = findDependency('firebase', cwd);
-        // auth requires beforeAuthStateChanged, released in 9.8.0
-        if (client === 'auth' && lt(firebaseDependency.version, MIN_FIREBASE_SDK_FOR_AUTH)) return;
-        // TODO log to the firebase.log
-        console.log(`Substituting import of '${resource.request}' with 'firebase-frameworks/client/${client}' in ${relative(cwd, resource.context)}.`);
-        resource.request = require.resolve(`firebase-frameworks/client/${client}`);
-    })
 };

src/utils.ts

@@ -19,6 +19,7 @@
     "src/server/index.ts",
     "src/server/firebase-aware.ts",
     "src/frameworks/*/server.ts",
+    "src/client/*/index.ts",
     "types/*.d.ts"
   ]
 }