VueSSRClientPlugin Class — vue Architecture
Architecture documentation for the VueSSRClientPlugin class in client.ts from the vue codebase.
Entity Profile
Dependency Diagram
graph TD 62cf6712_fa7f_7220_17ce_d09b09419c6f["VueSSRClientPlugin"] 061cdd3c_2a4a_f420_388b_683da0ed2615["client.ts"] 62cf6712_fa7f_7220_17ce_d09b09419c6f -->|defined in| 061cdd3c_2a4a_f420_388b_683da0ed2615 8c40a849_ec7c_da37_0d56_f107a5964e61["constructor()"] 62cf6712_fa7f_7220_17ce_d09b09419c6f -->|method| 8c40a849_ec7c_da37_0d56_f107a5964e61 ad95ac41_077e_09d3_ca71_cac40d4008b4["apply()"] 62cf6712_fa7f_7220_17ce_d09b09419c6f -->|method| ad95ac41_077e_09d3_ca71_cac40d4008b4
Relationship Graph
Source Code
packages/server-renderer/src/webpack-plugin/client.ts lines 5–76
export default class VueSSRClientPlugin {
constructor(options = {}) {
//@ts-expect-error no type on options
this.options = Object.assign(
{
filename: 'vue-ssr-client-manifest.json'
},
options
)
}
apply(compiler) {
const stage = 'PROCESS_ASSETS_STAGE_ADDITIONAL'
onEmit(compiler, 'vue-client-plugin', stage, (compilation, cb) => {
const stats = compilation.getStats().toJson()
const allFiles = uniq(stats.assets.map(a => a.name))
const initialFiles = uniq(
Object.keys(stats.entrypoints)
.map(name => stats.entrypoints[name].assets)
.reduce((assets, all) => all.concat(assets), [])
.map(getAssetName)
.filter(file => isJS(file) || isCSS(file))
)
const asyncFiles = allFiles
.filter(file => isJS(file) || isCSS(file))
.filter(file => initialFiles.indexOf(file) < 0)
const manifest = {
publicPath: stats.publicPath,
all: allFiles,
initial: initialFiles,
async: asyncFiles,
modules: {
/* [identifier: string]: Array<index: number> */
}
}
const assetModules = stats.modules.filter(m => m.assets.length)
const fileToIndex = asset => manifest.all.indexOf(getAssetName(asset))
stats.modules.forEach(m => {
// ignore modules duplicated in multiple chunks
if (m.chunks.length === 1) {
const cid = m.chunks[0]
const chunk = stats.chunks.find(c => c.id === cid)
if (!chunk || !chunk.files) {
return
}
const id = stripModuleIdHash(m.identifier)
const files = (manifest.modules[hash(id)] =
chunk.files.map(fileToIndex))
// find all asset modules associated with the same chunk
assetModules.forEach(m => {
if (m.chunks.some(id => id === cid)) {
files.push.apply(files, m.assets.map(fileToIndex))
}
})
}
})
const json = JSON.stringify(manifest, null, 2)
//@ts-expect-error no type on options
compilation.assets[this.options.filename] = {
source: () => json,
size: () => json.length
}
cb()
})
}
}
Domain
Source
Frequently Asked Questions
What is the VueSSRClientPlugin class?
VueSSRClientPlugin is a class in the vue codebase, defined in packages/server-renderer/src/webpack-plugin/client.ts.
Where is VueSSRClientPlugin defined?
VueSSRClientPlugin is defined in packages/server-renderer/src/webpack-plugin/client.ts at line 5.
Analyze Your Own Codebase
Get architecture documentation, dependency graphs, and domain analysis for your codebase in minutes.
Try Supermodel Free