Skip to content

Commit b947efd

Browse files
jaydensericjaydenseric
committed
Support Node.js ESM.
Fixes vercel#640 .
1 parent d111ffc commit b947efd

27 files changed

+174
-86
lines changed

‎css.js

+3-21
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,5 @@
1-
function notTranspiledError(name) {
2-
throw new Error(
3-
'styled-jsx/css: if you are getting this error it means that your `' +
4-
name +
5-
'` tagged template literals were not transpiled.'
6-
)
7-
}
8-
9-
function css() {
10-
notTranspiledError('css')
11-
}
12-
13-
css.global = function() {
14-
notTranspiledError('global')
15-
}
16-
17-
css.resolve = function() {
18-
notTranspiledError('resolve')
19-
}
1+
const { css, global, resolve } = require('./dist/decoys')
202

213
module.exports = css
22-
module.exports.global = css.global
23-
module.exports.resolve = css.resolve
4+
module.exports.global = global
5+
module.exports.resolve = resolve

‎css.mjs

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
import decoys from './dist/decoys.js'
2+
3+
export default decoys.css
4+
export const global = decoys.global
5+
export const resolve = decoys.resolve

‎readme.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -128,7 +128,7 @@ Turn on/off automatic vendor prefixing (default: `true`)
128128
The example above transpiles to the following:
129129

130130
```jsx
131-
import _JSXStyle from 'styled-jsx/style'
131+
import _JSXStyle from 'styled-jsx/style.js'
132132

133133
export default () => (
134134
<div className="jsx-123">

‎src/_utils.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -678,7 +678,7 @@ export const booleanOption = opts => {
678678
export const createReactComponentImportDeclaration = () =>
679679
t.importDeclaration(
680680
[t.importDefaultSpecifier(t.identifier(STYLE_COMPONENT))],
681-
t.stringLiteral('styled-jsx/style')
681+
t.stringLiteral('styled-jsx/style.js')
682682
)
683683

684684
export const setStateOptions = state => {

‎src/babel-external.js

+6-3
Original file line numberDiff line numberDiff line change
@@ -129,8 +129,11 @@ function addHash(exportIdentifier, hash) {
129129

130130
export const visitor = {
131131
ImportDeclaration(path, state) {
132-
// import css from 'styled-jsx/css'
133-
if (path.node.source.value !== 'styled-jsx/css') {
132+
// Bail if the import doesn’t have one of these specifiers:
133+
// - styled-jsx/css
134+
// - styled-jsx/css.mjs
135+
// - 'styled-jsx/css.js
136+
if (!/^styled-jsx\/css(?:\.m?js)?$/.test(path.node.source.value)) {
134137
return
135138
}
136139

@@ -218,7 +221,7 @@ export const visitor = {
218221
)
219222

220223
// When using the `resolve` helper we need to add an import
221-
// for the _JSXStyle component `styled-jsx/style`
224+
// for the _JSXStyle component `styled-jsx/style.js`
222225
if (
223226
hasJSXStyle &&
224227
taggedTemplateExpressions.resolve.length > 0 &&

‎src/decoys.js

+19
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
function notTranspiledError(name) {
2+
throw new Error(
3+
'styled-jsx/css: if you are getting this error it means that your `' +
4+
name +
5+
'` tagged template literals were not transpiled.'
6+
)
7+
}
8+
9+
export function css() {
10+
notTranspiledError('css')
11+
}
12+
13+
export function global() {
14+
notTranspiledError('global')
15+
}
16+
17+
export function resolve() {
18+
notTranspiledError('resolve')
19+
}

‎test/babel6/snapshots/attribute.js.md

+2-2
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ Generated by [AVA](https://ava.li).
88

99
> Snapshot 1
1010
11-
`import _JSXStyle from 'styled-jsx/style';␊
11+
`import _JSXStyle from 'styled-jsx/style.js';␊
1212
import styles from './styles';␊
1313
␊
1414
const styles2 = require('./styles2');␊
@@ -108,7 +108,7 @@ Generated by [AVA](https://ava.li).
108108
109109
`var _this = this;␊
110110
␊
111-
import _JSXStyle from "styled-jsx/style";␊
111+
import _JSXStyle from "styled-jsx/style.js";␊
112112
export default (() => {␊
113113
const Element = 'div';␊
114114
return <div className={"jsx-2886504620"}>␊

‎test/babel6/snapshots/attribute.js.snap

2 Bytes
Binary file not shown.

‎test/babel6/snapshots/external.js.md

+7-7
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ Generated by [AVA](https://ava.li).
88

99
> Snapshot 1
1010
11-
`import _JSXStyle from 'styled-jsx/style';␊
11+
`import _JSXStyle from 'styled-jsx/style.js';␊
1212
␊
1313
import colors, { size } from './constants';␊
1414
const color = 'red';␊
@@ -98,7 +98,7 @@ Generated by [AVA](https://ava.li).
9898

9999
> Snapshot 1
100100
101-
`import _JSXStyle from 'styled-jsx/style';␊
101+
`import _JSXStyle from 'styled-jsx/style.js';␊
102102
␊
103103
␊
104104
function test() {␊
@@ -112,7 +112,7 @@ Generated by [AVA](https://ava.li).
112112

113113
> Snapshot 1
114114
115-
`import _JSXStyle from 'styled-jsx/style';␊
115+
`import _JSXStyle from 'styled-jsx/style.js';␊
116116
␊
117117
import colors, { size } from './constants';␊
118118
const color = 'red';␊
@@ -168,7 +168,7 @@ Generated by [AVA](https://ava.li).
168168

169169
> Snapshot 1
170170
171-
`import _JSXStyle from "styled-jsx/style";␊
171+
`import _JSXStyle from "styled-jsx/style.js";␊
172172
import styles from './styles2';␊
173173
␊
174174
export default (({ level = 1 }) => {␊
@@ -184,7 +184,7 @@ Generated by [AVA](https://ava.li).
184184

185185
> Snapshot 1
186186
187-
`import _JSXStyle from 'styled-jsx/style';␊
187+
`import _JSXStyle from 'styled-jsx/style.js';␊
188188
import styles from './styles';␊
189189
const styles2 = require('./styles2');␊
190190
import { foo as styles3 } from './styles';␊
@@ -211,7 +211,7 @@ Generated by [AVA](https://ava.li).
211211

212212
> Snapshot 1
213213
214-
`import _JSXStyle from 'styled-jsx/style';␊
214+
`import _JSXStyle from 'styled-jsx/style.js';␊
215215
import styles, { foo as styles3 } from './styles';␊
216216
␊
217217
const styles2 = require('./styles2');␊
@@ -229,7 +229,7 @@ Generated by [AVA](https://ava.li).
229229

230230
> Snapshot 1
231231
232-
`import _JSXStyle from 'styled-jsx/style';␊
232+
`import _JSXStyle from 'styled-jsx/style.js';␊
233233
import styles from './styles';␊
234234
␊
235235
export default (() => <div className={`jsx-${styles.__hash}`}>␊

‎test/babel6/snapshots/external.js.snap

-1 Bytes
Binary file not shown.

‎test/babel6/snapshots/index.js.md

+14-14
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ Generated by [AVA](https://ava.li).
88

99
> Snapshot 1
1010
11-
`import _JSXStyle from 'styled-jsx/style';␊
11+
`import _JSXStyle from 'styled-jsx/style.js';␊
1212
export default (() => <div className={"jsx-2743241663"}>␊
1313
<p className={"jsx-2743241663"}>test</p>␊
1414
<p className={"jsx-2743241663"}>woot</p>␊
@@ -28,7 +28,7 @@ Generated by [AVA](https://ava.li).
2828

2929
> Snapshot 1
3030
31-
`import _JSXStyle from 'styled-jsx/style';␊
31+
`import _JSXStyle from 'styled-jsx/style.js';␊
3232
export default (() => <div className={"jsx-2743241663"}>␊
3333
<p className={"jsx-2743241663"}>test</p>␊
3434
<p className={"jsx-2743241663"}>woot</p>␊
@@ -40,7 +40,7 @@ Generated by [AVA](https://ava.li).
4040

4141
> Snapshot 1
4242
43-
`import _JSXStyle from 'styled-jsx/style';␊
43+
`import _JSXStyle from 'styled-jsx/style.js';␊
4444
const Test = () => <_JSXStyle id={"2743241663"}>{"p{color:red;}"}</_JSXStyle>;␊
4545
␊
4646
export default (() => <div className={"jsx-2673076688"}>␊
@@ -53,7 +53,7 @@ Generated by [AVA](https://ava.li).
5353

5454
> Snapshot 1
5555
56-
`import _JSXStyle from 'styled-jsx/style';␊
56+
`import _JSXStyle from 'styled-jsx/style.js';␊
5757
const color = 'red';␊
5858
const otherColor = 'green';␊
5959
␊
@@ -76,7 +76,7 @@ Generated by [AVA](https://ava.li).
7676

7777
> Snapshot 1
7878
79-
`import _JSXStyle from "styled-jsx/style";␊
79+
`import _JSXStyle from "styled-jsx/style.js";␊
8080
const Test = () => <div className={"jsx-2529315885"}>␊
8181
<span className={"jsx-2529315885"}>test</span>␊
8282
<Component />␊
@@ -87,7 +87,7 @@ Generated by [AVA](https://ava.li).
8787

8888
> Snapshot 1
8989
90-
`import _JSXStyle from "styled-jsx/style";␊
90+
`import _JSXStyle from "styled-jsx/style.js";␊
9191
export default class {␊
9292
␊
9393
render() {␊
@@ -103,7 +103,7 @@ Generated by [AVA](https://ava.li).
103103

104104
> Snapshot 1
105105
106-
`import _JSXStyle from 'styled-jsx/style';␊
106+
`import _JSXStyle from 'styled-jsx/style.js';␊
107107
␊
108108
␊
109109
export default (({ children }) => <div className={`jsx-${styles.__hash}`}>␊
@@ -127,7 +127,7 @@ Generated by [AVA](https://ava.li).
127127

128128
> Snapshot 1
129129
130-
`import _JSXStyle from "styled-jsx/style";␊
130+
`import _JSXStyle from "styled-jsx/style.js";␊
131131
export default (({ level = 1 }) => {␊
132132
const Element = `h${level}`;␊
133133
␊
@@ -158,7 +158,7 @@ Generated by [AVA](https://ava.li).
158158

159159
> Snapshot 1
160160
161-
`import _JSXStyle from 'styled-jsx/style';␊
161+
`import _JSXStyle from 'styled-jsx/style.js';␊
162162
export default class {␊
163163
render() {␊
164164
const Element = 'div';␊
@@ -184,7 +184,7 @@ Generated by [AVA](https://ava.li).
184184

185185
> Snapshot 1
186186
187-
`import _JSXStyle from 'styled-jsx/style';␊
187+
`import _JSXStyle from 'styled-jsx/style.js';␊
188188
const darken = c => c;␊
189189
const color = 'red';␊
190190
const otherColor = 'green';␊
@@ -215,7 +215,7 @@ Generated by [AVA](https://ava.li).
215215

216216
> Snapshot 1
217217
218-
`import _JSXStyle from 'styled-jsx/style';␊
218+
`import _JSXStyle from 'styled-jsx/style.js';␊
219219
const Test = () => <div className={"jsx-2209073070"}>␊
220220
<_JSXStyle id={"2209073070"}>{"body{color:red;}:hover{color:red;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-animation:foo 1s ease-out;animation:foo 1s ease-out;}div a{display:none;}[data-test]>div{color:red;}"}</_JSXStyle>␊
221221
</div>;␊
@@ -226,7 +226,7 @@ Generated by [AVA](https://ava.li).
226226

227227
> Snapshot 1
228228
229-
`import _JSXStyle from "styled-jsx/style";␊
229+
`import _JSXStyle from "styled-jsx/style.js";␊
230230
const attrs = {␊
231231
id: 'test'␊
232232
};␊
@@ -257,7 +257,7 @@ Generated by [AVA](https://ava.li).
257257

258258
> Snapshot 1
259259
260-
`import _JSXStyle from 'styled-jsx/style';␊
260+
`import _JSXStyle from 'styled-jsx/style.js';␊
261261
export default (() => <div className={"jsx-2743241663"}>␊
262262
<p className={"jsx-2743241663"}>woot</p>␊
263263
<style dangerouslySetInnerHTML={{ __html: `body { margin: 0; }` }}></style>␊
@@ -268,7 +268,7 @@ Generated by [AVA](https://ava.li).
268268

269269
> Snapshot 1
270270
271-
`import _JSXStyle from 'styled-jsx/style';␊
271+
`import _JSXStyle from 'styled-jsx/style.js';␊
272272
export default (() => <div className={"jsx-2743241663"}>␊
273273
<p className={"jsx-2743241663"}>test</p>␊
274274
<p className={"jsx-2743241663"}>woot</p>␊

‎test/babel6/snapshots/index.js.snap

2 Bytes
Binary file not shown.

‎test/babel6/snapshots/macro.js.md

+3-3
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ Generated by [AVA](https://ava.li).
88

99
> Snapshot 1
1010
11-
`import _JSXStyle from 'styled-jsx/style';␊
11+
`import _JSXStyle from 'styled-jsx/style.js';␊
1212
␊
1313
␊
1414
({␊
@@ -20,7 +20,7 @@ Generated by [AVA](https://ava.li).
2020

2121
> Snapshot 1
2222
23-
`import _JSXStyle from 'styled-jsx/style';␊
23+
`import _JSXStyle from 'styled-jsx/style.js';␊
2424
␊
2525
␊
2626
function test() {␊
@@ -34,7 +34,7 @@ Generated by [AVA](https://ava.li).
3434

3535
> Snapshot 1
3636
37-
`import _JSXStyle from 'styled-jsx/style';␊
37+
`import _JSXStyle from 'styled-jsx/style.js';␊
3838
␊
3939
␊
4040
const { className, styles } = {␊

‎test/babel6/snapshots/macro.js.snap

3 Bytes
Binary file not shown.

‎test/babel6/snapshots/plugins.js.md

+2-2
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ Generated by [AVA](https://ava.li).
88

99
> Snapshot 1
1010
11-
`import _JSXStyle from 'styled-jsx/style';␊
11+
`import _JSXStyle from 'styled-jsx/style.js';␊
1212
import styles from './styles';␊
1313
const color = 'red';␊
1414
␊
@@ -39,7 +39,7 @@ Generated by [AVA](https://ava.li).
3939

4040
> Snapshot 1
4141
42-
`import _JSXStyle from 'styled-jsx/style';␊
42+
`import _JSXStyle from 'styled-jsx/style.js';␊
4343
import styles from './styles';␊
4444
const color = 'red';␊
4545
␊

‎test/babel6/snapshots/plugins.js.snap

2 Bytes
Binary file not shown.

0 commit comments

Comments
 (0)