Skip to content
This repository was archived by the owner on Sep 20, 2024. It is now read-only.

Commit 1eaed0a

Browse files
committed
fix: got a nice build
1 parent 1b6ddd3 commit 1eaed0a

File tree

106 files changed

+681
-530
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

106 files changed

+681
-530
lines changed

.size-limit.json

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,11 @@
11
[
22
{
3-
"path": "packages/core/dist/chakra-ui-vue-next.cjs.js",
3+
"path": "packages/vue/dist/chakra-ui-vue-next.cjs.js",
44
"limit": "86 KB",
55
"ignore": ["vue", "@emotion/css"]
66
},
77
{
8-
"path": "packages/core/dist/chakra-ui-vue-next.esm.js",
8+
"path": "packages/vue/dist/chakra-ui-vue-next.esm.js",
99
"limit": "85 KB",
1010
"ignore": ["vue", "@emotion/css"]
1111
}

modules/nuxt/package.json

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,7 @@
2121
"scripts": {
2222
"prebuild": "nuxi prepare playground",
2323
"build": "unbuild",
24+
"build:fast": "unbuild",
2425
"dev": "echo 'Dev'",
2526
"start": "nuxi dev playground",
2627
"dev:build": "nuxi build playground",
@@ -55,5 +56,6 @@
5556
},
5657
"publishConfig": {
5758
"access": "public"
58-
}
59+
},
60+
"module": "dist/chakra-ui-nuxt-next.esm.mjs"
5961
}

modules/nuxt/playground/app.vue

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
<c-container>
33
<c-heading>Chakra UI Vue Next</c-heading>
44
<c-grid template-columns="1fr 1fr" gap="5">
5-
<c-grid-item>
5+
<!-- <c-grid-item>
66
<c-stack>
77
<c-h-stack>
88
<chakra.p>Toggle Color Mode</chakra.p>
@@ -27,7 +27,7 @@
2727
>
2828
</c-stack>
2929
</c-stack>
30-
</c-grid-item>
30+
</c-grid-item> -->
3131
<c-grid-item>
3232
<c-heading>Toast</c-heading>
3333
<c-button @click="handleClick">Hello Chakra UI</c-button>
Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
import ChakraUI from "../src/module"
2+
23
export default defineNuxtConfig({
34
modules: [ChakraUI],
45
})

modules/nuxt/playground/tsup.config.ts

Lines changed: 0 additions & 21 deletions
This file was deleted.

modules/nuxt/src/module.ts

Lines changed: 17 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -50,6 +50,9 @@ export default defineNuxtModule<ChakraModuleOptions>({
5050
compatibilty: ">=3.0.0",
5151
},
5252
setup(__options, nuxt) {
53+
// Install emotion module
54+
// installModule("@nuxtjs/emotion")
55+
5356
const _options = mergeWith(
5457
defaultModuleOptions,
5558
__options
@@ -61,6 +64,16 @@ export default defineNuxtModule<ChakraModuleOptions>({
6164
const emotionCacheOptions = _options.emotionCacheOptions
6265
const cssReset = _options.cssReset
6366

67+
nuxt.hook("nitro:config", (config) => {
68+
// Prevent inlining emotion (+ the crucial css cache!) in dev mode
69+
if (nuxt.options.dev) {
70+
if (config.externals) {
71+
config.externals.external ||= []
72+
config.externals.external.push("@emotion/server")
73+
}
74+
}
75+
})
76+
6477
nuxt.options.build.transpile.push("@chakra-ui")
6578

6679
nuxt.options.appConfig.$chakraConfig = {
@@ -71,12 +84,14 @@ export default defineNuxtModule<ChakraModuleOptions>({
7184
emotionCacheOptions,
7285
}
7386

74-
// Install emotion module
75-
installModule("@nuxtjs/emotion")
7687
const { resolve } = createResolver(import.meta.url)
7788
const runtimeDir = resolve("./runtime")
7889
nuxt.options.build.transpile.push(runtimeDir)
7990

91+
// Add emotion plugins
92+
addServerPlugin(resolve(runtimeDir, "emotion.server"))
93+
addPlugin(resolve(runtimeDir, "emotion.client"))
94+
8095
// Resolve template and inject plugin
8196
addPlugin(resolve(runtimeDir, "chakra"))
8297
addServerPlugin(resolve(runtimeDir, "chakra.server"))
Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
import { hydrate } from "@emotion/css"
2+
import { defineNuxtPlugin } from "#imports"
3+
4+
export default defineNuxtPlugin((_) => {
5+
if (window.$emotionSSRIds) {
6+
const ids = window.$emotionSSRIds
7+
hydrate(ids)
8+
}
9+
})
Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
import { extractCritical } from "@emotion/server"
2+
import { NitroApp } from "nitropack"
3+
4+
/**
5+
* Why are we declaring types for `defineNitroPlugin`?
6+
*
7+
* It appears that there is no way to import `defineNitroPlugin` from #imports
8+
* without TypeScript screaming. It might be that the `#imports` types are not
9+
* exported at project generation phase with `nuxi` CLI
10+
*
11+
* If this issue can be resolved, then this code can of course be deleted
12+
* and changed to the following:
13+
*
14+
* ```ts
15+
* import { defineNitroPlugin } from '#imports'
16+
* ```
17+
*/
18+
19+
export type NitroAppPlugin = (nitro: NitroApp) => void
20+
21+
export function defineNitroPlugin(def: NitroAppPlugin): NitroAppPlugin {
22+
return def
23+
}
24+
25+
export default defineNitroPlugin((nitroApp) => {
26+
nitroApp.hooks.hook("render:html", (html) => {
27+
const { ids, css } = extractCritical(html.body)
28+
html.head.push(`<style data-emotion="${ids.join(" ")}">${css}</style>`)
29+
html.head.push(
30+
`<script data-emotion="${ids.join(
31+
" "
32+
)}">window.$emotionSSRIds=${JSON.stringify(ids)}</script>`
33+
)
34+
})
35+
})

modules/nuxt/test/fixtures/basic/tsup.config.ts

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,8 @@ export default defineConfig({
1616
}),
1717
],
1818
format: ["esm", "cjs"],
19-
entry: ["src/**/*.(ts|tsx)"],
19+
entry: {
20+
"chakra-ui-vue-next-test-fixture": "src/index.tsx",
21+
},
2022
keepNames: true,
2123
})

package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -92,7 +92,7 @@
9292
"@ctrl/tinycolor": "^3.4.1",
9393
"@cypress/vite-dev-server": "^5.0.2",
9494
"@cypress/vue": "^5.0.3",
95-
"@emotion/css": "^11.10.5",
95+
"@emotion/css": "^11.10.6",
9696
"@emotion/jest": "^11.7.1",
9797
"@emotion/server": "^11.10.0",
9898
"@manypkg/cli": "^0.17.0",

0 commit comments

Comments
 (0)