babel-plugin-cssta-stylename - npm Package Compare versions

Comparing version 0.1.4 to 0.1.5

index.js

@@ -55,3 +55,3 @@ const utils = require('./utils')
       const oldTagExpr = getOldTagExpr(item.oldTag, animate)
-      const newTagExpr = getNewTagExpr(item.newTag, oldTagExpr, styles)
+      const newTagExpr = getNewTagExpr(item.newTag, oldTagExpr, styles, JSXOpeningElement)
       lastImport.insertAfter(newTagExpr)
@@ -79,3 +79,3 @@ }
 
-  function getNewTagExpr (newTag, oldTagExpr, styles) {
+  function getNewTagExpr (newTag, oldTagExpr, styles, path) {
     const styled = t.taggedTemplateExpression(
@@ -90,4 +90,5 @@ t.callExpression(csstaTemplate, [oldTagExpr]),
     )
-
-    const d = t.variableDeclarator(t.identifier(newTag), styled)
+    const reactIdentifier = utils.getReactImport(t, path)
+    const memoed = t.callExpression(t.memberExpression(reactIdentifier, t.identifier('memo')), [styled])
+    const d = t.variableDeclarator(t.identifier(newTag), memoed)
     return t.variableDeclaration('const', [d])
@@ -122,2 +123,22 @@ }
 
+  function maybeUpdateCssHash (delayExecution, state) {
+    // Force update JS file in the same directory with the new css file hash.
+    // This is required for proper development experience on native and web.
+    // TODO: Make this a plugin option and only enabled in dev env.
+    const addCssHash = state.opts.addCssHash != null
+      ? state.opts.addCssHash
+      : DEFAULT_ADD_CSS_HASH
+    if (addCssHash && /\.css$/.test(state.file.opts.filename)) {
+      const filename = state.file.opts.filename
+      // Delay execution to account for Save All delay in IDEs
+      if (delayExecution) {
+        setTimeout(() => {
+          utils.maybeUpdateCssHash(filename)
+        }, ADD_CSS_HASH_DELAY)
+      } else {
+        utils.maybeUpdateCssHash(filename)
+      }
+    }
+  }
+
   return {
@@ -168,15 +189,3 @@ post () {
 
-          // Force update JS file in the same directory with the new css file hash.
-          // This is required for proper development experience on native and web.
-          // TODO: Make this a plugin option and only enabled in dev env.
-          const addCssHash = state.opts.addCssHash != null
-            ? state.opts.addCssHash
-            : DEFAULT_ADD_CSS_HASH
-          if (addCssHash && /\.css$/.test(state.file.opts.filename)) {
-            const filename = state.file.opts.filename
-            // Delay execution to account for Save All delay in IDEs
-            setTimeout(() => {
-              utils.maybeUpdateCssHash(filename)
-            }, ADD_CSS_HASH_DELAY)
-          }
+          maybeUpdateCssHash(true, state)
         }
@@ -183,0 +192,0 @@ },

package.json

 {
   "name": "babel-plugin-cssta-stylename",
-  "version": "0.1.4",
+  "version": "0.1.5",
   "description": "Transform css imports into cssta template components",
@@ -5,0 +5,0 @@ "keywords": [

utils.js

@@ -103,1 +103,14 @@ const fs = require('fs')
 }
+
+exports.getReactImport = function getReactImport (t, path) {
+  const allBindings = Object.values(path.scope.getAllBindingsOfKind('module'))
+  const allImportBindings = allBindings.filter(reference =>
+    t.isImportDefaultSpecifier(reference.path.node)
+  )
+  const importBindingsForModule = allImportBindings.filter(reference => {
+    const importDeclaration = reference.path.findParent(t.isImportDeclaration)
+    const importModuleName = importDeclaration.node.source.value
+    return importModuleName === 'react'
+  })
+  return importBindingsForModule[0] && t.cloneDeep(importBindingsForModule[0].identifier)
+}

No alert changes

Improved metrics

Total package byte prevSize

14304

increased by6.91%

Lines of code

274

increased by8.3%

No dependency changes