Files
jsowell-charger-web/jsowell-ui/node_modules/svg-sprite-loader/examples/server-side-rendering
Lemon f5e6e29f00 Merge branch 'dev-zza' into dev
# Conflicts:
#	jsowell-ui/.env.development
#	jsowell-ui/.env.staging
#	jsowell-ui/bin/build-sit.bat
#	jsowell-ui/bin/build.bat
#	jsowell-ui/src/api/adapayMember/adapayMember.js
#	jsowell-ui/src/api/pile/merchant.js
#	jsowell-ui/src/router/index.js
#	jsowell-ui/src/views/financial/financeDetail.vue
#	jsowell-ui/src/views/financial/merchant.vue
#	jsowell-ui/src/views/homeIndex/homeIndex.vue
#	jsowell-ui/src/views/login.vue
#	jsowell-ui/src/views/pile/basic/detail.vue
#	jsowell-ui/src/views/pile/station/components/SiteInfo.vue
#	jsowell-ui/src/views/pile/station/detail.vue
#	jsowell-ui/src/views/pile/station/orderReport.vue
2025-06-03 14:26:37 +08:00
..
2025-06-03 14:26:37 +08:00
2025-06-03 14:26:37 +08:00

Server side rendering example

When webpack config target option is 'node' svg-sprite-loader will use isomorphic runtime sprite module.

Demo

Input

main.js

import symbol from '../assets/twitter.svg';

// Import sprite instance which already contains twitter logo required above
import sprite from 'svg-sprite-loader/runtime/sprite.build';

// Render sprite
const spriteContent = sprite.stringify();

const pageContent = `
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
</head>
<body>
${spriteContent}

<svg viewBox="${symbol.viewBox}">
  <use xlink:href="#${symbol.id}"></use>
</svg>
</body>
</html>
`;

console.log(pageContent);

Output