Skip to content

Commit

Permalink
build: use bunchee for bundling (#802)
Browse files Browse the repository at this point in the history
* Use bunchee for bundling

* update snapshot

* bump deps

* update babel cli dep

* bump bundler

* update bunchee with swc compiler

* rm no-sourcemap flag

* upgrade and change arg

* update to stable

* fix build

* bundle stylis

* update exports

* update babel exports

* fix export
  • Loading branch information
huozhi authored Sep 2, 2022
1 parent 41443ab commit 66bd5f0
Show file tree
Hide file tree
Showing 11 changed files with 2,528 additions and 4,025 deletions.
2 changes: 1 addition & 1 deletion babel.js
Original file line number Diff line number Diff line change
@@ -1 +1 @@
module.exports = require('./dist/babel')
module.exports = require('./dist/babel').default
12 changes: 6 additions & 6 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -23,10 +23,10 @@
],
"typings": "./index.d.ts",
"scripts": {
"build": "rm -rf dist && rm -rf out && babel src --out-dir out && yarn build-babel && yarn build-webpack && yarn build-index",
"build-babel": "ncc build out/babel.js -e react -e babel-plugin-macros --target es5 -o dist/babel",
"build-webpack": "ncc build out/webpack.js -e react -e babel-plugin-macros --target es5 -o dist/webpack",
"build-index": "ncc build out/index.js -e react -e babel-plugin-macros --target es5 -o dist/index",
"build": "rm -rf dist && rm -rf out && yarn build-babel && yarn build-webpack && yarn build-index",
"build-babel": "bunchee src/babel.js -f cjs --runtime node -e react -e babel-plugin-macros -o dist/babel/index.js",
"build-webpack": "bunchee src/webpack.js -f cjs --runtime node -e react -e babel-plugin-macros -o dist/webpack/index.js",
"build-index": "bunchee src/index.js -f cjs --runtime node -o dist/index/index.js",
"test": "ava",
"lint": "eslint ./src",
"format": "prettier --write \"./{src,test}/**/*.{js,css}\"",
Expand Down Expand Up @@ -65,7 +65,7 @@
}
},
"devDependencies": {
"@babel/cli": "7.12.1",
"@babel/cli": "7.18.10",
"@babel/core": "7.12.3",
"@babel/plugin-proposal-object-rest-spread": "7.12.1",
"@babel/plugin-syntax-jsx": "7.14.5",
Expand All @@ -77,9 +77,9 @@
"@babel/register": "7.12.1",
"@babel/runtime": "7.12.5",
"@babel/types": "7.15.0",
"@vercel/ncc": "0.33.1",
"ava": "4.3.1",
"babel-plugin-macros": "2.8.0",
"bunchee": "2.0.3",
"convert-source-map": "1.7.0",
"eslint": "7.32.0",
"eslint-config-prettier": "4.0.0",
Expand Down
9 changes: 5 additions & 4 deletions src/babel.js
Original file line number Diff line number Diff line change
@@ -1,8 +1,6 @@
// Packages
import jsx from '@babel/plugin-syntax-jsx'

import { visitor as externalStylesVisitor } from './babel-external'

import {
isGlobalEl,
isStyledJsx,
Expand All @@ -18,12 +16,15 @@ import {
} from './_utils'
import { STYLE_COMPONENT } from './_constants'

import { default as babelMacro } from './macro'
import { default as babelTest } from './babel-test'

export function macro() {
return require('./macro')
return babelMacro
}

export function test() {
return require('./babel-test')
return babelTest
}

export default function({ types: t }) {
Expand Down
6 changes: 3 additions & 3 deletions src/lib/style-transform.js
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
const Stylis = require('stylis')
const stylisRuleSheet = require('stylis-rule-sheet')
import Stylis from 'stylis'
import stylisRuleSheet from 'stylis-rule-sheet'

const stylis = new Stylis()

Expand Down Expand Up @@ -113,4 +113,4 @@ function transform(hash, styles, settings = {}) {
return splitRules.join('')
}

module.exports = transform
export default transform
4 changes: 2 additions & 2 deletions src/webpack.js
Original file line number Diff line number Diff line change
@@ -1,8 +1,8 @@
const loaderUtils = require('loader-utils')
import loaderUtils from 'loader-utils'

const types = ['scoped', 'global', 'resolve']

module.exports = function(content) {
export default function(content) {
if (this.cacheable) this.cacheable()
this.addDependency(this.resourcePath)
const options = Object.assign({}, loaderUtils.getOptions(this))
Expand Down
4 changes: 2 additions & 2 deletions test/snapshots/external.js.md
Original file line number Diff line number Diff line change
Expand Up @@ -236,8 +236,8 @@ Generated by [AVA](https://avajs.dev).

> Snapshot 1
`import { jsx as _jsx } from "react/jsx-runtime";␊
import _JSXStyle from "styled-jsx/style";␊
`import _JSXStyle from "styled-jsx/style";␊
import { jsx as _jsx } from "react/jsx-runtime";␊
const A = {␊
styles: /*#__PURE__*/_jsx(_JSXStyle, {␊
id: "2723508961",␊
Expand Down
Binary file modified test/snapshots/external.js.snap
Binary file not shown.
2 changes: 1 addition & 1 deletion test/snapshots/index.js.md
Original file line number Diff line number Diff line change
Expand Up @@ -367,7 +367,7 @@ Generated by [AVA](https://avajs.dev).
};`

## works with existing identifier for \_JSXStyle
## works with existing identifier for _JSXStyle

> Snapshot 1
Expand Down
2 changes: 1 addition & 1 deletion test/snapshots/plugins.js.md
Original file line number Diff line number Diff line change
Expand Up @@ -42,6 +42,6 @@ Generated by [AVA](https://avajs.dev).
const color = 'red';␊
export default (() => <div className={\`jsx-${styles.__hash}\` + " " + _JSXStyle.dynamic([["2799750516", [color, otherColor]]])}>␊
<p className={\`jsx-${styles.__hash}\` + " " + _JSXStyle.dynamic([["2799750516", [color, otherColor]]])}>test</p>␊
<_JSXStyle id={"2799750516"} dynamic={[color, otherColor]}>{".test.__jsx-style-dynamic-selector{content:\\"{\\"foo\\":false,\\"babel\\":{\\"location\\":{\\"start\\":{\\"line\\":7,\\"column\\":16},\\"end\\":{\\"line\\":11,\\"column\\":5}},\\"vendorPrefixes\\":false,\\"sourceMaps\\":false,\\"isGlobal\\":false}}\\";}"}</_JSXStyle>␊
<_JSXStyle id={"2799750516"} dynamic={[color, otherColor]}>{".test.__jsx-style-dynamic-selector{content:\\"{\\"foo\\":false,\\"babel\\":{\\"location\\":{\\"start\\":{\\"line\\":7,\\"column\\":16,\\"index\\":114},\\"end\\":{\\"line\\":11,\\"column\\":5,\\"index\\":180}},\\"vendorPrefixes\\":false,\\"sourceMaps\\":false,\\"isGlobal\\":false}}\\";}"}</_JSXStyle>␊
<_JSXStyle id={styles.__hash}>{styles}</_JSXStyle>␊
</div>);`
Binary file modified test/snapshots/plugins.js.snap
Binary file not shown.
Loading

0 comments on commit 66bd5f0

Please sign in to comment.