fix: auto path resolution

aidenybai · Aug 9, 2023 · 2220e6c · 2220e6c
1 parent 5687026
commit 2220e6c
Show file tree

Hide file tree

Showing 4 changed files with 69 additions and 46 deletions.
diff --git a/packages/compiler/index.ts b/packages/compiler/index.ts
@@ -1,5 +1,4 @@
-import { unplugin, babelPlugin as babel } from './plugin';
-import type { Options } from './plugin';
+import { unplugin, babelPlugin as babel, type Options } from './plugin';
 
 export const vite = unplugin.vite;
 export const webpack = unplugin.webpack;
@@ -10,15 +9,20 @@ export const next = (
   nextConfig: Record<string, any> = {},
   overrideOptions: Options = {},
 ) => {
+  const millionOptions: Options = {
+    mode: 'react',
+    server: true,
+    ...overrideOptions,
+  };
   return {
     ...nextConfig,
-    webpack(config: Record<string, any>, options: Record<string, any>) {
-      config.plugins.unshift(
-        webpack({ mode: 'react', server: true, ...overrideOptions }),
-      );
+    webpack(config: Record<string, any>, webpackOptions: Record<string, any>) {
+      if (!webpackOptions.isServer) {
+        config.plugins.unshift(webpack(millionOptions));
+      }
 
       if (typeof nextConfig.webpack === 'function') {
-        return nextConfig.webpack(config, options);
+        return nextConfig.webpack(config, webpackOptions);
       }
       return config;
     },

diff --git a/packages/compiler/plugin.ts b/packages/compiler/plugin.ts
@@ -26,38 +26,39 @@ export interface Options {
   _file?: string;
 }
 
+let hasIntroRan = false;
+export const intro = (options: Options) => {
+  if (hasIntroRan) return;
+  hasIntroRan = true;
+  const comment = `${
+    styleLinks(
+      'Schedule a call if you need help: https://million.dev/hotline. To disable help messages, set the "mute" option to true.',
+    ) +
+    styleCommentMessage(
+      '\nThere is no guarantee that features in beta will be completely production ready, so here be dragons.',
+    )
+  }\n\n${blue('💡 TIP')}: Use ${styleCommentMessage(
+    '// million-ignore',
+  )} to skip over problematic components.`;
+
+  if (options.optimize) {
+    // eslint-disable-next-line no-console
+    console.log(
+      stylePrimaryMessage(`Optimizing compiler is enabled ✓ (beta)`, comment),
+    );
+  }
+  if (options.auto) {
+    // eslint-disable-next-line no-console
+    console.log(
+      stylePrimaryMessage(`Automatic mode is enabled ✓ (beta)`, comment),
+    );
+  }
+};
+
 export const unplugin = createUnplugin((options: Options = {}) => {
   return {
     enforce: 'pre',
     name: 'million',
-    buildStart() {
-      const comment = `${
-        styleLinks(
-          'Schedule a call if you need help: https://million.dev/hotline. To disable help messages, set the "mute" option to true.',
-        ) +
-        styleCommentMessage(
-          '\nThere is no guarantee that features in beta will be completely production ready, so here be dragons.',
-        )
-      }\n\n${blue('💡 TIP')}: Use ${styleCommentMessage(
-        '// million-ignore',
-      )} to skip over problematic components.`;
-
-      if (options.optimize) {
-        // eslint-disable-next-line no-console
-        console.log(
-          stylePrimaryMessage(
-            `Optimizing compiler is enabled ✓ (beta)`,
-            comment,
-          ),
-        );
-      }
-      if (options.auto) {
-        // eslint-disable-next-line no-console
-        console.log(
-          stylePrimaryMessage(`Automatic mode is enabled ✓ (beta)`, comment),
-        );
-      }
-    },
     transformInclude(id: string) {
       return /\.[jt]sx$/.test(id);
     },
@@ -86,6 +87,8 @@ export const unplugin = createUnplugin((options: Options = {}) => {
 export const babelPlugin = declare((api, options: Options) => {
   api.assertVersion(7);
 
+  intro(options);
+
   const file = options._file as string;
   let callExpressionVisitor: ReturnType<typeof reactCallExpressionVisitor>;
   let jsxElementVisitor: ReturnType<typeof reactJsxElementVisitor> | undefined;

diff --git a/packages/compiler/react/component-visitor.ts b/packages/compiler/react/component-visitor.ts
@@ -4,7 +4,6 @@ import {
   addNamedCache,
   handleVisitorError,
   isComponent,
-  resolveCorrectImportSource,
   resolvePath,
   styleSecondaryMessage,
 } from './utils';
@@ -17,20 +16,25 @@ export const componentVisitor = (options: Options = {}, isReact = true) => {
     rawComponentPath: NodePath<t.FunctionDeclaration | t.VariableDeclarator>,
     file: string,
   ) => {
-    if (!isReact || !options.auto) return; // doesn't support Preact yet
+    const rawComponent = rawComponentPath.node;
+    const programPath = rawComponentPath.findParent((path) =>
+      path.isProgram(),
+    ) as NodePath<t.Program>;
+
+    const isRawComponentPathInProgramScope =
+      t.isIdentifier(rawComponent.id) &&
+      programPath.scope.hasOwnBinding(rawComponent.id.name);
+
+    if (!isReact || !options.auto || !isRawComponentPathInProgramScope) return; // doesn't support Preact yet
 
     const rawComponentParentPath = rawComponentPath.parentPath;
-    const rawComponent = rawComponentPath.node;
 
     if (
       rawComponentParentPath.isCallExpression() &&
       t.isIdentifier(rawComponentParentPath.node.callee, { name: 'block' }) // probably need a import level check later
     )
       return;
 
-    const programPath = rawComponentPath.findParent((path) =>
-      path.isProgram(),
-    ) as NodePath<t.Program>;
     let componentPath: NodePath<
       t.FunctionDeclaration | t.FunctionExpression | t.ArrowFunctionExpression
     >;
@@ -71,9 +75,13 @@ export const componentVisitor = (options: Options = {}, isReact = true) => {
     if (!t.isIdentifier(rawComponent.id)) return;
     if (!isComponent(rawComponent.id.name)) return;
 
+    const globalPath = rawComponentPath.findParent(
+      (path) => path.parentPath?.isProgram() || path.isProgram(),
+    )!;
     const comment =
-      rawComponent.leadingComments?.[0] ??
-      rawComponentParentPath.node.leadingComments?.[0]; // for VariableDeclarators
+      rawComponent.leadingComments?.[0] ||
+      rawComponentParentPath.node.leadingComments?.[0] ||
+      globalPath.node.leadingComments?.[0];
 
     if (comment?.value.includes('million-ignore')) {
       // eslint-disable-next-line no-console
@@ -200,7 +208,7 @@ export const componentVisitor = (options: Options = {}, isReact = true) => {
       ? t.identifier('block')
       : addNamedCache(
           'block',
-          resolveCorrectImportSource(options, 'million/react'),
+          options.server ? 'million/react-server' : 'million/react',
           rawComponentPath,
         );
 

diff --git a/packages/compiler/react/transform.ts b/packages/compiler/react/transform.ts
@@ -602,7 +602,11 @@ export const transformJSX = (
                 t.booleanLiteral(unstable),
               ]);
               const id = createDynamic(null, nestedRender, null, () => {
-                jsxPath.replaceWith(t.jsxExpressionContainer(id!));
+                jsxPath.replaceWith(
+                  isRoot
+                    ? t.expressionStatement(id!)
+                    : t.jsxExpressionContainer(id!),
+                );
               });
               return dynamics;
             }
@@ -805,7 +809,11 @@ export const transformJSX = (
             t.booleanLiteral(unstable),
           ]);
           const id = createDynamic(null, nestedRender, null, () => {
-            jsxPath.replaceWith(t.jsxExpressionContainer(id!));
+            jsxPath.replaceWith(
+              isRoot
+                ? t.expressionStatement(id!)
+                : t.jsxExpressionContainer(id!),
+            );
           });
           return dynamics;
         }