Not generate cache for identifier (#1796)

* Not generate cache for identifier

* Add changeset

---------

Co-authored-by: Liam Ma <[email protected]>

Author: liamqma

.changeset/many-sheep-change.md

@@ -0,0 +1,5 @@
+---
+'@compiled/babel-plugin': patch
+---
+
+Stop checking if styles are cssMap if being used as `css={styles}`. This is to improve build performance.

packages/babel-plugin/src/css-map/__tests__/index.test.ts

@@ -128,7 +128,9 @@ describe('css map basic functionality', () => {
 
       const styles = cssMap({ root: { color: 'red' } });
     `);
-    }).toThrow(ErrorMessages.USE_VARIANT_OF_CSS_MAP);
+    }).toThrow(
+      'This CallExpression was unable to have its styles extracted — try to define them statically using Compiled APIs instead'
+    );
   });
 
   it('should error out if variants are not defined at the top-most scope of the module.', () => {

packages/babel-plugin/src/utils/css-builders.ts

@@ -1004,9 +1004,11 @@ export const buildCss = (node: t.Expression | t.Expression[], meta: Metadata): C
       );
     }
 
-    // In some cases, the `state.cssMap` is not warmed yet, so run it:
-    generateCacheForCSSMap(node, meta);
     if (meta.state.cssMap[node.name]) {
+      // it doesn't cover the case where styles are defined after its consumer.
+      // e.g.
+      // <div css={styles} />
+      // const styles = cssMap({ root: { color: 'red' } });
       throw buildCodeFrameError(
         createErrorMessage(ErrorMessages.USE_VARIANT_OF_CSS_MAP),
         node,