compiled icon indicating copy to clipboard operation
compiled copied to clipboard

Rebound imports when spread can't be found

Open itsdouges opened this issue 5 years ago • 0 comments

Doesnt work

import { base as hotpink } from './mixins';

const base = {
  ...hotpink,
  padding: '0.5rem 0',
  backgroundColor: 'rgba(0, 0, 0, 0.05)',
}

Results in

SyntaxError: /Users/mdougall/projects/website/packages/examples/src/css-prop-composition-multiple.tsx: Variable could not be found (10:5).
   8 |
   9 | const base = {
> 10 |   ...hotpink,
     |      ^^^^^^^
  11 |   padding: '0.5rem 0',
  12 |   backgroundColor: 'rgba(0, 0, 0, 0.05)',
  13 | };
    at File.buildCodeFrameError (/Users/mdougall/projects/website/node_modules/@babel/core/lib/transformation/file/file.js:250:12)
    at NodePath.buildCodeFrameError (/Users/mdougall/projects/website/node_modules/@babel/traverse/lib/path/index.js:163:21)
    at Object.exports.buildCodeFrameError (/Users/mdougall/projects/website/node_modules/@compiled/babel-plugin/dist/utils/ast.js:57:52)
    at /Users/mdougall/projects/website/node_modules/@compiled/babel-plugin/dist/utils/css-builders.js:87:33
    at Array.forEach (<anonymous>)
    at extractObjectExpression (/Users/mdougall/projects/website/node_modules/@compiled/babel-plugin/dist/utils/css-builders.js:40:21)
    at Object.exports.buildCss (/Users/mdougall/projects/website/node_modules/@compiled/babel-plugin/dist/utils/css-builders.js:178:16)
    at Object.exports.buildCss (/Users/mdougall/projects/website/node_modules/@compiled/babel-plugin/dist/utils/css-builders.js:188:30)
    at Object.exports.visitCssPropPath (/Users/mdougall/projects/website/node_modules/@compiled/babel-plugin/dist/css-prop/index.js:42:36)
    at PluginPass.JSXOpeningElement (/Users/mdougall/projects/website/node_modules/@compiled/babel-plugin/dist/index.js:80:28) {
  code: 'BABEL_TRANSFORM_ERROR'
}

As well as

import { basebase } from './mixins';

const danger = {
  color: 'red',
};

const base = {
  ...basebase,
  padding: '0.5rem 0',
  backgroundColor: 'rgba(0, 0, 0, 0.05)',
};

Results in

🚨  /Users/mdougall/projects/website/node_modules/@compiled/website-examples/src/css-prop-composition-multiple.tsx: /Users/mdougall/projects/website/node_modules/@compiled/website-examples/src/css-prop-composition-multiple.tsx: CallExpression isn't a supported CSS type - try using an object or string. (This is an error on an internal node. Probably an internal error. Location has been estimated.)
   8 |
   9 | const base = {
> 10 |   ...basebase,
     |      ^^^^^^^^
  11 |   padding: '0.5rem 0',
  12 |   backgroundColor: 'rgba(0, 0, 0, 0.05)',
  13 | };
   8 |
   9 | const base = {
> 10 |   ...basebase,
     |      ^^^^^^^^
  11 |   padding: '0.5rem 0',
  12 |   backgroundColor: 'rgba(0, 0, 0, 0.05)',
  13 | };
    at File.buildCodeFrameError (/Users/mdougall/projects/website/node_modules/@babel/core/lib/transformation/file/file.js:250:12)
    at NodePath.buildCodeFrameError (/Users/mdougall/projects/website/node_modules/@babel/traverse/lib/path/index.js:163:21)
    at Object.exports.buildCodeFrameError (/Users/mdougall/projects/website/node_modules/@compiled/babel-plugin/dist/utils/ast.js:57:52)
    at Object.exports.buildCss (/Users/mdougall/projects/website/node_modules/@compiled/babel-plugin/dist/utils/css-builders.js:215:17)
    at Object.exports.buildCss (/Users/mdougall/projects/website/node_modules/@compiled/babel-plugin/dist/utils/css-builders.js:188:30)
    at Object.exports.visitCssPropPath (/Users/mdougall/projects/website/node_modules/@compiled/babel-plugin/dist/css-prop/index.js:42:36)
    at PluginPass.JSXOpeningElement (/Users/mdougall/projects/website/node_modules/@compiled/babel-plugin/dist/index.js:80:28)
    at newFn (/Users/mdougall/projects/website/node_modules/@babel/traverse/lib/visitors.js:175:21)
    at NodePath._call (/Users/mdougall/projects/website/node_modules/@babel/traverse/lib/path/context.js:55:20)
    at NodePath.call (/Users/mdougall/projects/website/node_modules/@babel/traverse/lib/path/context.js:42:17)

itsdouges avatar Nov 06 '20 03:11 itsdouges