search

martinandert / babel-plugin-css-in-js

A plugin for Babel v6 which transforms inline styles defined in JavaScript modules into class names so they become available to, e.g. the `className` prop of React elements. While transforming, the plugin processes all JavaScript style definitions found and bundles them up into a CSS file, ready to be requested from your web server.
MIT License
299 stars 11 forks source link

Single letter class names cause an error #7

Closed AriaFallah closed 8 years ago

AriaFallah commented 8 years ago

I had the following in a cssInJS block

a: {
  width: 150,
  margin: 'auto'
}

and got the error:

Module build failed: AssertionError: /Users/Developer/workspace/projects/formulagrid/website/src/containers/HomePage.js: style name is invalid
    at initStyleSpec (/Users/Developer/workspace/projects/formulagrid/website/node_modules/babel-plugin-css-in-js/lib/transformStyleSheetObjectIntoSpecification.js:162:24)
    at processStyle (/Users/Developer/workspace/projects/formulagrid/website/node_modules/babel-plugin-css-in-js/lib/transformStyleSheetObjectIntoSpecification.js:83:15)
    at /Users/Developer/workspace/projects/formulagrid/website/node_modules/babel-plugin-css-in-js/lib/transformStyleSheetObjectIntoSpecification.js:50:7
    at forEach (/Users/Developer/workspace/projects/formulagrid/website/node_modules/foreach/index.js:17:20)
    at transformStyleSheetObjectIntoSpecification (/Users/Developer/workspace/projects/formulagrid/website/node_modules/babel-plugin-css-in-js/lib/transformStyleSheetObjectIntoSpecification.js:35:25)
    at PluginPass.CallExpression (/Users/Developer/workspace/projects/formulagrid/website/node_modules/babel-plugin-css-in-js/lib/index.js:116:76)
    at newFn (/Users/Developer/workspace/projects/formulagrid/website/node_modules/babel-traverse/lib/visitors.js:293:19)
    at NodePath._call (/Users/Developer/workspace/projects/formulagrid/website/node_modules/babel-traverse/lib/path/context.js:74:18)
    at NodePath.call (/Users/Developer/workspace/projects/formulagrid/website/node_modules/babel-traverse/lib/path/context.js:46:17)
    at NodePath.visit (/Users/Developer/workspace/projects/formulagrid/website/node_modules/babel-traverse/lib/path/context.js:104:12)
    at TraversalContext.visitQueue (/Users/Developer/workspace/projects/formulagrid/website/node_modules/babel-traverse/lib/context.js:156:16)
 @ ./src/containers/App.js 13:16-37

This was also the case with any other single letter names I tried out. Changing it to two letters fixes the problem.

martinandert commented 8 years ago

@AriaFallah Good catch! I've fixed it in v1.2.1.