无法在 vuetify 中使用材料设计图标

Question

我使用 css 安装图标npm install material-design-icons-iconfont，它在节点模块中可用。在我构建之后，下面的 woff 文件在 dist 中可用

Material-design-icons.css

  /* For IE6-8 */
      src: local("Material Icons"), local("MaterialIcons-Regular"), 
      url("./fonts/MaterialIcons-Regular.woff2") format("woff2"), 
      url("./fonts/MaterialIcons-Regular.woff") format("woff"), 
      url("./fonts/MaterialIcons-Regular.ttf") format("truetype");

所有三个 woff 文件都显示 404。我在 dist 文件夹中进行了验证，我可以在 static/fonts/ .woff 中看到所有这些文件。在浏览器控制台中还有`localhost:8000/static/fonts/ .woff。所有文件名和路径都正确，但在控制台中仍然看到 404 错误。

Answer 1

Afetr NPM 安装后，为什么不按照 Vuetify 文档将其导入您的main.js或app.js文件。

// main.js
import 'material-design-icons-iconfont/dist/material-design-icons.css'
// Ensure you are using css-loader

Vue.use(Vuetify, {
  iconfont: 'md'
})

但最简单的方法就是包含 CDN 链接：

<link href="https://fonts.googleapis.com/css?family=Material+Icons" rel="stylesheet">