feat: debug mode for CLI, Vite, and Webpack (#1298)

callstack · Jul 23, 2023 · 520ba8d · 520ba8d
1 parent c90ba49
commit 520ba8d
Show file tree

Hide file tree

Showing 17 changed files with 435 additions and 139 deletions.
diff --git a/.changeset/stale-brooms-kick.md b/.changeset/stale-brooms-kick.md
@@ -0,0 +1,11 @@
+---
+'@linaria/babel-preset': patch
+'@linaria/cli': patch
+'@linaria/testkit': patch
+'@linaria/utils': patch
+'@linaria/vite': patch
+'@linaria/webpack5-loader': patch
+'linaria-website': patch
+---
+
+Debug mode for CLI, Webpack 5 and Vite. When enabled, prints brief perf report to console and information about processed dependency tree to the specified file.
diff --git a/.gitignore b/.gitignore
@@ -10,6 +10,7 @@ logs
 npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
+**/linaria-debug.json
 
 # Runtime data
 pids

diff --git a/packages/babel/src/plugins/preeval.ts b/packages/babel/src/plugins/preeval.ts
@@ -7,6 +7,7 @@ import type { BabelFile, PluginObj } from '@babel/core';
 import { createCustomDebug } from '@linaria/logger';
 import type { StrictOptions } from '@linaria/utils';
 import {
+  EventEmitter,
   getFileIdx,
   addIdentifierToLinariaPreval,
   removeDangerousCode,
@@ -20,12 +21,14 @@ import { processTemplateExpression } from '../utils/processTemplateExpression';
 export type PreevalOptions = Pick<
   StrictOptions,
   'classNameSlug' | 'displayName' | 'evaluate' | 'features'
->;
+> & { eventEmitter: EventEmitter };
+
+const onFinishCallbacks = new WeakMap<object, () => void>();
 
 export default function preeval(
   babel: Core,
-  options: PreevalOptions
-): PluginObj<IPluginState> {
+  { eventEmitter = EventEmitter.dummy, ...options }: PreevalOptions
+): PluginObj<IPluginState & { onFinish: () => void }> {
   const { types: t } = babel;
   return {
     name: '@linaria/babel/preeval',
@@ -38,6 +41,10 @@ export default function preeval(
       const rootScope = file.scope;
       this.processors = [];
 
+      const onProcessTemplateFinished = eventEmitter.pair({
+        method: 'preeval:processTemplate',
+      });
+
       file.path.traverse({
         Identifier: (p) => {
           processTemplateExpression(p, file.opts, options, (processor) => {
@@ -53,15 +60,28 @@ export default function preeval(
         },
       });
 
+      onProcessTemplateFinished();
+
       if (
         isFeatureEnabled(options.features, 'dangerousCodeRemover', filename)
       ) {
         log('start', 'Strip all JSX and browser related stuff');
+        const onCodeRemovingFinished = eventEmitter.pair({
+          method: 'preeval:removeDangerousCode',
+        });
         removeDangerousCode(file.path);
+        onCodeRemovingFinished();
       }
+
+      onFinishCallbacks.set(
+        this,
+        eventEmitter.pair({ method: 'preeval:rest-transformations' })
+      );
     },
     visitor: {},
     post(file: BabelFile) {
+      onFinishCallbacks.get(this)?.();
+
       const log = createCustomDebug('preeval', getFileIdx(file.opts.filename!));
 
       if (this.processors.length === 0) {