Vuetifyのiconが表示されない。

前提・実現したいこと

LaravelでVueを使用していて、今回はそのVueにVuetifyの導入を試みています。
Vuetify自体の表示にも戸惑っていたのですが、なんとか表示できるようになりました。
過去の質問

デフォルトに設定されているMaterial Iconsを使用したいです。
また、使用方法はCDNではなくローカルでの使用を希望します。

発生している問題

ドキュメントに沿って
$ yarn add material-design-icons-iconfont -Dを実行
import 'material-design-icons-iconfont/dist/material-design-icons.css'を追加しましたが、表示されるのは文字列でアイコンは表示されません。

###エラーコード

GET http://localhost/fonts/vendor/material-design-icons-icondist/MaterialIcons-Regular.woff?9219a80f0478e0bfdee5f4c753ce8535 net::ERR_ABORTED 404 (Not Found)

該当のソースコード

package.json

JSON
1{
2    "private": true,
3    "scripts": {
4        "dev": "npm run development",
5        "development": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
6        "watch": "npm run development -- --watch",
7        "watch-poll": "npm run watch -- --watch-poll",
8        "hot": "cross-env NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --config=node_modules/laravel-mix/setup/webpack.config.js",
9        "prod": "npm run production",
10        "production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --no-progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"
11    },
12    "devDependencies": {
13        "axios": "^0.18",
14        "bootstrap": "^4.0.0",
15        "cross-env": "^5.1",
16        "@fortawesome/fontawesome-free": "^5.7.2",
17        "@mdi/font": "^3.5.95",
18        "material-design-icons-iconfont": "^4.0.5",
19        "jquery": "^3.2",
20        "laravel-mix": "^4.0.7",
21        "lodash": "^4.17.5",
22        "popper.js": "^1.12",
23        "resolve-url-loader": "^2.3.1",
24        "sass": "^1.15.2",
25        "sass-loader": "7.*",
26        "url-loader": "^1.1.2",
27        "vue": "^2.5.17",
28        "vue-template-compiler": "^2.5.21"
29    },
30    "dependencies": {
31        "eslint": "^5.12.1",
32        "stylus": "^0.54.5",
33        "stylus-loader": "^3.0.2",
34        "switch-php": "^1.1.3",
35        "vee-validate": "^2.1.5",
36        "vue-router": "^3.0.2",
37        "vuetify": "1.3.16"
38    }
39}

app.js

require('./bootstrap');
import Vue from 'vue'

//以下、VeeValidateの導入
import VeeValidate, { Validator } from 'vee-validate';
Vue.use(VeeValidate);
import VeeValidateJaLocale from 'vee-validate/dist/locale/ja'
Validator.localize('ja',VeeValidateJaLocale);

//以下、Vuetifyの導入
import Vuetify from 'vuetify'
import 'vuetify/dist/vuetify.min.css'
import 'vuetify/src/stylus/app.styl'

//以下、Vuetifyのicon
import '@mdi/font/css/materialdesignicons.css'//mdi
import 'material-design-icons-iconfont/dist/material-design-icons.css'//md

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

import router from './router.js'
import UserRoot from './UserRoot'

Vue.component('admin-root', require('./AdminRoot').default);
Vue.component('user-root', require('./UserRoot').default);

const admin_top = new Vue({
    el: '#admin-top',
    router,
});

const user_top = new Vue({
    el: '#user-top',
    router,
    render:h=>h(UserRoot)
});

ドキュメントのselectを流用してサンプルを作成しました
このコンポーネントを呼び出す側で<v-app>でのラッピングはしています

vue
1<template>
2    <v-container fluid grid-list-xl>
3        <v-layout wrap align-center>
4
5            <v-flex xs12 sm6 d-flex>
6                <v-select
7                        :items="items"
8                        label="Standard"
9                >
10                    <v-icon>arrow_drop_down</v-icon>
11                </v-select>
12            </v-flex>
13        </v-layout>
14    </v-container>
15</template>
16
17<script>
18    export default {
19        name: "TestSelect",
20        data() {
21            return {
22                items: ['Foo', 'Bar', 'Fizz', 'Buzz']
23            }
24        },
25    }
26</script>
27
28<style scoped>
29
30</style>