Vue.js Vuetify+；Nuxt&x2B；本地添加md图标

如何在本地导入“md”图标，类似于本文中导入mdi图标的方式：

标准包或定制回购协议 我正在使用nuxt vuetify插件。 我的所有尝试都失败，例如添加以下内容：

nuxt.config.js

css: ['~/assets/main.css', './node_modules/material-design-icons-iconfont/dist/material-design-icons.css'],

vuetify: {
  customVariables: ['~/assets/variables.scss'],
  treeShake: true,
  defaultAssets: {
    font: false,
    icons: 'md',// this just fetches it from the repo
// icons: {iconfont: 'md'} // this doesn't seem to work for me
    enter code here
    },
    theme: {
      dark: false,
      themes: {
        light: {
          primary: '#fec655',
        },
      }
    }
  },

---

我在发布后马上解决了它。 最后，原始问题中的设置是正确的。 只需从原始源或源安装“md”包即可

之后，只需更改全局CSS导入即可。 例如 css:['./node_模块/材质设计图标iconfont/dist/material design icons.css']

附带说明的是，通过为treeshaken版本安装mdi/js并手动进行导入，似乎可以同时使用“md”和“mdi”。

---

这样，您可以为所有组件使用默认图标，但如果需要，仍然可以从MDI添加更多图标。由于“mdi”捆绑包的容量约为330kb，而“md”捆绑包的容量仅为80kb，因此节省了大量空间。

Vuetify集成了材质图标。我也在用vuejs、nuxtjs进行开发。我刚刚使用这个命令安装了font

npm install@mdi/font-D

，我可以在

v-icon

中使用任何材质图标

mdi图标名

。选中此项是，但这是关于“md”库而不是mdi库的：）。在本地添加md与mdi最终只是为了关闭全局css导入。