从 Nuxt 中的 static/assets 文件夹提供 SVG 内容

【问题标题】：Serving SVG content from static/assets folder in Nuxt从 Nuxt 中的 static/assets 文件夹提供 SVG 内容
【发布时间】：2021-04-09 14:58:33
【问题描述】：

我的网站中有很多 SVG，它们有很多路径，所以我不想让我的代码与它们混淆，而是在浏览器中显示完整的代码。

在 PHP 中有一个名为 file_get_contents('path') 的神奇函数

在 Nuxt 中是否有替代方案？到目前为止，唯一的选择是将其作为常规的img 标签来禁止所有样式。

【问题讨论】：

标签： vue.js nuxt.js nuxtjs

【解决方案1】：

查看@nuxtjs/svg 模块 (NPM)。使用该模块，您可以在脚本中导入 svg，并像模板中的组件一样使用它们。

<template>
  <NuxtLogo class="logo" />
</template>
 
<script>
  import NuxtLogo from "~/assets/nuxt.svg?inline";
 
  export default {
    components: { NuxtLogo },
  };
</script>

<style scoped>
.logo {
  fill: #fff;
}
</style>

【讨论】：

你太棒了。