问题

这是我们正在努力解决的代码片段，但实际上它生成了一个错误。错误消息说：“找不到别名图标 $vuetify.icons.gaming”。

import { createVuetify } from 'vuetify';
import * as components from 'vuetify/components';
import * as directives from 'vuetify/directives';
import gamingIcon from 'assets/custom-icons/sector/gaming.vue';

const opts = {
  icons: {
    // iconfont: 'mdi',
    defaultSet: 'mdi',
    aliases,
    sets: {
      gaming: {
        component: gamingIcon,
      },
    },
  },
};

const vuetify = createVuetify({
  opts,
  components,
  directives,
});

export default vuetify;

任何帮助将不胜感激。

import { createVuetify } from 'vuetify';
import * as components from 'vuetify/components';
import * as directives from 'vuetify/directives';
import gamingIcon from 'assets/custom-icons/sector/gaming.vue';

const opts = {
  icons: {
    // iconfont: 'mdi',
    defaultSet: 'mdi',
    aliases,
    sets: {
      gaming: {
        component: gamingIcon,
      },
	},
  },
};

const vuetify = createVuetify({
  opts,
  components,
  directives,
});

export default vuetify;

答案1

得分: 1

添加自定义图标作为别名

import { createVuetify } from 'vuetify';
import * as components from 'vuetify/components';
import * as directives from 'vuetify/directives';
import { aliases, mdi } from "vuetify/iconsets/mdi";

import gamingIcon from 'assets/custom-icons/sector/gaming.vue';
const aliasesCustom = {
  ...aliases,
  gamingIcon,
};

const opts = {
  icons: {
    defaultSet: "mdi",
    aliases: {
      ...aliasesCustom,
    },
    sets: {
      mdi,
    },
  },
};

const vuetify = createVuetify({
  opts,
  components,
  directives,
});

export default vuetify;

SFC usage

<v-icon>$gamingIcon</v-icon>

Stackblitz example

<details>
<summary>英文:</summary>

Add your custom icon as an alias

```js
import { createVuetify } from &#39;vuetify&#39;;
import * as components from &#39;vuetify/components&#39;;
import * as directives from &#39;vuetify/directives&#39;;
import { aliases, mdi } from &quot;vuetify/iconsets/mdi&quot;;

import gamingIcon from &#39;assets/custom-icons/sector/gaming.vue&#39;;
const aliasesCustom = {
  ...aliases,
  gamingIcon,
};

const opts = {
  icons: {
    defaultSet: &quot;mdi&quot;,
    aliases: {
      ...aliasesCustom,
    },
    sets: {
      mdi,
    },
  },
};

const vuetify = createVuetify({
  opts,
  components,
  directives,
});

export default vuetify;

SFC usage

<v-icon>$gamingIcon</v-icon>

Stackblitz example