Static GitHub Issues

[3203] svg can't be used in nuxt.js

prev: When using commonJS Module and JSON.stringify together, an error occured: Cannot assign to read only property 'exports' of object '#<Object>'
next: Access passed props from page component's asyncData method
  1. I import a svg component, like this
<template> <svg class="svg-icon" aria-hidden="true"> <use :xlink:href="iconName"></use> </svg> </template> <script> export default { name: 'icon-svg', props: { iconClass: { type: String, required: true } }, computed: { iconName() { return `#icon-${this.iconClass}` } } } </script>

2.export in 'components/common/index.js' export { default as Iconsvg } from './Icon-svg'

<!--cmty--><!--cmty_prevent_hook--><div align="right"><sub><em>This question is available on <a href="https://nuxtjs.cmty.io">Nuxt.js</a> community (<a href="https://nuxtjs.cmty.io/nuxt/nuxt.js/issues/c6867">#c6867</a>)</em></sub></div>