Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Breaking change with tsdx 0.12.1 with Tailwind babel macro #413

Closed
fknop opened this issue Jan 4, 2020 · 7 comments · Fixed by #415
Closed

Breaking change with tsdx 0.12.1 with Tailwind babel macro #413

fknop opened this issue Jan 4, 2020 · 7 comments · Fixed by #415

Comments

@fknop
Copy link

fknop commented Jan 4, 2020

Current Behavior

I'm using tailwind.macro in a React library with Storybook built with tsdx. On tsdx 0.12.0, everything was working as expected as babel macros are supported out of the box.
However, when updating to 0.12.1, my builds stopped working properly with tailwind.macro.

I created a repository with the two versions and a simple component including styled-components and tailwind.macro: https://github.com/fknop/tsdx-tailwind.macro-bug.
I also included the two dist folders from the two versions:
0.12.0: https://github.com/fknop/tsdx-tailwind.macro-bug/blob/master/tsdx-0.12.0/library/dist/library.esm.js
0.12.1: https://github.com/fknop/tsdx-tailwind.macro-bug/blob/master/tsdx-0.12.1/library/dist/library.esm.js

As we can see, tw is not imported anywhere in the 0.12.1 version. This makes any code importing this build failing with the function tw being undefined.

Tested on both MacOS and Windows 10.

@agilgur5
Copy link
Collaborator

agilgur5 commented Jan 4, 2020

Might be related to #130 (comment) , but not sure.
Only other big thing that changed was the fix for getter/setter treeshaking optimization in #371 , which I don't think is related, but I was concerned about it breaking things per the PR. Success/Failure Hooks & TranspileOnly were added in a patch release as well

@fknop
Copy link
Author

fknop commented Jan 4, 2020

Interesting!
I just tried to set the target of the reproduction repository to esnext, and the tailwind import seems to be back.

This is the output of the build with 0.12.1 and target: esnext

import _styled from 'styled-components';
import _tailwindUtils from 'tailwind.macro/utils.umd.js';

var _tailwindConfig2 = {};

var _tailwindConfig =
/*#__PURE__*/
_tailwindUtils.resolveConfig(_tailwindConfig2);

// Delete me
var Comp =
/*#__PURE__*/
_styled.div.withConfig({
  displayName: "src__Comp",
  componentId: "sc-19dskac-0"
})(["", ""],
/*#__PURE__*/
Object.assign(
/*#__PURE__*/
_tailwindUtils.resolveStyle(_tailwindConfig, [{
  "prop": "color",
  "config": "textColor"
}, {
  "prop": "fontSize",
  "config": "fontSize"
}], "xs")));

export { Comp };
//# sourceMappingURL=library.esm.js.map

@jaredpalmer
Copy link
Owner

What need to be changed?

agilgur5 added a commit to agilgur5/tsdx that referenced this issue Jan 4, 2020
- not sure why this change was made in that PR as it was unrelated to
  the rest, but it broke some things related to Babel usage and maybe
  other things
  - e.g. babel macros were not included per jaredpalmer#413
  - and it used `tslib` instead of adding babel helper functions

- add a comment of why it seems like the target is overriden to esnext
  - though I am not sure of the original reasoning, as it has existed
    since very early versions of TSDX, see jaredpalmer#130 comments
@agilgur5
Copy link
Collaborator

agilgur5 commented Jan 4, 2020

Seems like that confirms my fears in #130 (comment). Great reproduction @fknop !

The importing of tslib in 0.12.1 vs. insertion of babel helpers in 0.12 and prior is also a notable difference, related to #412

@jaredpalmer I reverted the extraneous changes of #130 in #415

jaredpalmer pushed a commit that referenced this issue Jan 5, 2020
- not sure why this change was made in that PR as it was unrelated to
  the rest, but it broke some things related to Babel usage and maybe
  other things
  - e.g. babel macros were not included per #413
  - and it used `tslib` instead of adding babel helper functions

- add a comment of why it seems like the target is overriden to esnext
  - though I am not sure of the original reasoning, as it has existed
    since very early versions of TSDX, see #130 comments
@fknop
Copy link
Author

fknop commented Jan 5, 2020

Thank you for the quick fix!

@agilgur5
Copy link
Collaborator

agilgur5 commented Mar 9, 2020

@all-contributors please add @fknop for bug

@allcontributors
Copy link
Contributor

@agilgur5

I've put up a pull request to add @fknop! 🎉

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging a pull request may close this issue.

3 participants