Skip to content

Commit 77eb78f

Browse files
webfansplzwebfansplz
committed
feat(vite): add assets map for chunk
1 parent ea8709f commit 77eb78f

File tree

7 files changed

+74
-43
lines changed

7 files changed

+74
-43
lines changed

‎packages/vite/src/app/components/assets/BaseInfo.vue‎

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
<script setup lang="ts">
2+
import type { RolldownAssetInfo } from '~~/shared/types'
3+
4+
defineProps<{
5+
asset: RolldownAssetInfo
6+
}>()
7+
</script>
8+
9+
<template>
10+
<div flex="~ gap-2 items-center">
11+
<div i-catppuccin-java-class-abstract />
12+
<div>{{ asset.filename }}</div>
13+
<DisplayFileSizeBadge :bytes="asset.size" text-sm />
14+
<DisplayBadge :text="asset.type" />
15+
</div>
16+
</template>

‎packages/vite/src/app/components/data/AssetDetails.vue‎

Lines changed: 2 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
11
<script setup lang="ts">
22
import type { Asset as AssetInfo } from '@rolldown/debug'
3-
import type {} from '@vitejs/devtools'
43
import type { RolldownAssetInfo, RolldownChunkInfo, SessionContext } from '~~/shared/types'
54
import { useRoute } from '#app/composables/router'
65
import { useRpc } from '#imports'
@@ -74,12 +73,7 @@ function openInEditor() {
7473
<template>
7574
<div flex="~ col gap-3">
7675
<div flex="~ gap-4 items-center wrap">
77-
<div flex="~ gap-2 items-center">
78-
<div i-catppuccin-java-class-abstract />
79-
<div>{{ asset.filename }}</div>
80-
<DisplayFileSizeBadge :bytes="asset.size" text-sm />
81-
<DisplayBadge :text="asset.type" />
82-
</div>
76+
<AssetsBaseInfo :asset="asset" />
8377
<div flex-auto />
8478
<div flex="~ gap-2">
8579
<button btn-action @click="openInEditor">
@@ -127,8 +121,7 @@ function openInEditor() {
127121
<DataChunkDetails
128122
:chunk="chunk"
129123
:session="session"
130-
:show-modules="false"
131-
:show-imports="false"
124+
:show-details="false"
132125
/>
133126
</NuxtLink>
134127
</div>

‎packages/vite/src/app/components/data/ChunkDetails.vue‎

Lines changed: 47 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,17 @@
11
<script setup lang="ts">
22
import type { RolldownChunkImport, RolldownChunkInfo, SessionContext } from '~~/shared/types'
3+
import { useRoute } from '#app/composables/router'
34
import { useRpc } from '#imports'
45
import { useAsyncState } from '@vueuse/core'
56
import { computed } from 'vue'
67
78
const props = withDefaults(defineProps<{
89
chunk: RolldownChunkInfo
910
session: SessionContext
10-
showModules?: boolean
11-
showImports?: boolean
11+
showDetails?: boolean
1212
chunks?: RolldownChunkInfo[]
1313
}>(), {
14-
showModules: true,
15-
showImports: true,
14+
showDetails: true,
1615
})
1716
1817
const modulesMap = computed(() => {
@@ -29,6 +28,7 @@ const chunkSize = computed(() => props.chunk.modules.reduce((total, moduleId) =>
2928
return transforms?.length ? total + transforms[transforms.length - 1]!.transformed_code_size : total
3029
}, 0))
3130
31+
const route = useRoute()
3232
const rpc = useRpc()
3333
const { state, isLoading } = useAsyncState(
3434
async () => {
@@ -84,42 +84,56 @@ const importers = computed((): RolldownChunkImport[] => {
8484
<slot />
8585
</ChunksBaseInfo>
8686

87-
<details v-if="showModules" open="true">
88-
<summary op50>
89-
<span>Modules ({{ chunk.modules.length }})</span>
90-
</summary>
91-
<DisplayExpandableContainer flex="~ col gap-1" mt2 ws-nowrap :list="chunk.modules">
92-
<template #default="{ items }">
93-
<DisplayModuleId
94-
v-for="module of items"
95-
:id="module"
96-
:key="module"
97-
:session
98-
:link="true"
99-
:minimal="true"
100-
hover="bg-active"
101-
border="~ base rounded" px2 py1 w-full
102-
/>
103-
</template>
104-
</DisplayExpandableContainer>
105-
</details>
106-
107-
<VisualLoading v-if="isLoading" />
108-
109-
<template v-else-if="showImports">
110-
<details v-if="chunk.imports.length" open="true">
87+
<template v-if="showDetails">
88+
<details open="true">
11189
<summary op50>
112-
<span>Imports ({{ chunk.imports.length }})</span>
90+
Assets
11391
</summary>
114-
<ChunksImports :imports="imports" />
92+
<NuxtLink
93+
border="~ base rounded-lg" px2 mt2 py1 min-w-fit flex="~"
94+
:to="{ path: route.path, query: { asset: chunk.asset?.filename } }"
95+
>
96+
<AssetsBaseInfo :asset="{ ...chunk.asset!, type: 'asset' }" />
97+
</NuxtLink>
11598
</details>
11699

117-
<details v-if="importers.length" open="true">
100+
<details open="true">
118101
<summary op50>
119-
<span>Importers ({{ importers.length }})</span>
102+
<span>Modules ({{ chunk.modules.length }})</span>
120103
</summary>
121-
<ChunksImports :imports="importers" />
104+
<DisplayExpandableContainer flex="~ col gap-1" mt2 ws-nowrap :list="chunk.modules">
105+
<template #default="{ items }">
106+
<DisplayModuleId
107+
v-for="module of items"
108+
:id="module"
109+
:key="module"
110+
:session
111+
:link="true"
112+
:minimal="true"
113+
hover="bg-active"
114+
border="~ base rounded" px2 py1 w-full
115+
/>
116+
</template>
117+
</DisplayExpandableContainer>
122118
</details>
119+
120+
<VisualLoading v-if="isLoading" />
121+
122+
<template v-else>
123+
<details v-if="chunk.imports.length" open="true">
124+
<summary op50>
125+
<span>Imports ({{ chunk.imports.length }})</span>
126+
</summary>
127+
<ChunksImports :imports="imports" />
128+
</details>
129+
130+
<details v-if="importers.length" open="true">
131+
<summary op50>
132+
<span>Importers ({{ importers.length }})</span>
133+
</summary>
134+
<ChunksImports :imports="importers" />
135+
</details>
136+
</template>
123137
</template>
124138
</div>
125139
</template>

‎packages/vite/src/node/rolldown/events-manager.ts‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,7 @@ export class RolldownEventsManager {
1717
events: RolldownEvent[] = []
1818
chunks: Map<number, RolldownChunkInfo> = new Map()
1919
assets: Map<string, AssetInfo> = new Map()
20+
chunkAssetMap = new Map<number, AssetInfo>()
2021
modules: Map<string, ModuleInfo & { build_metrics?: ModuleBuildMetrics }> = new Map()
2122
source_refs: Map<string, string> = new Map()
2223
module_build_hook_events: Map<string, ModuleBuildHookEvents> = new Map()
@@ -182,6 +183,7 @@ export class RolldownEventsManager {
182183
for (const asset of event.assets) {
183184
this.assets.set(asset.filename, asset)
184185
}
186+
this.chunkAssetMap = new Map(event.assets.map(asset => [asset.chunk_id!, asset]))
185187
}
186188

187189
return event

‎packages/vite/src/node/rpc/functions/rolldown-get-chunk-info.ts‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,9 +10,11 @@ export const rolldownGetChunkInfo = defineRpcFunction({
1010
return {
1111
handler: async ({ session, id }: { session: string, id: number }) => {
1212
const reader = await manager.loadSession(session)
13-
const chunk = reader.manager.chunks.get(id)
13+
const chunk = reader.manager.chunks.get(id)!
1414
if (chunk && !chunk.name)
1515
chunk.name = guessChunkName(chunk)
16+
17+
chunk.asset = reader.manager.chunkAssetMap.get(chunk.chunk_id)
1618
return chunk
1719
},
1820
}

‎packages/vite/src/node/rpc/functions/rolldown-get-chunks-graph.ts‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -11,9 +11,12 @@ export const rolldownGetChunksGraph = defineRpcFunction({
1111
handler: async ({ session }: { session: string }) => {
1212
const reader = await manager.loadSession(session)
1313
const chunks = Array.from(reader.manager.chunks.values())
14+
1415
chunks.forEach((chunk) => {
1516
if (chunk && !chunk.name)
1617
chunk.name = guessChunkName(chunk)
18+
19+
chunk.asset = reader.manager.chunkAssetMap.get(chunk.chunk_id)
1720
})
1821
return chunks
1922
},

‎packages/vite/src/shared/types/data.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -162,6 +162,7 @@ export interface RolldownModuleNoChangesHide {
162162
export interface RolldownChunkInfo extends ChunkInfo {
163163
type?: 'chunk'
164164
is_initial?: boolean
165+
asset?: AssetInfo
165166
}
166167

167168
export interface RolldownAssetInfo extends AssetInfo {

0 commit comments

Comments
 (0)