首页 > 解决方案 > 无法安装 vuetify

问题描述

通过 vue add vuetify 安装 vuetify 时出现错误。不确定这是什么。请在下面找到错误:错误:找不到模块 '../presets/undefined'

标签: vue.jsvuetify.js

解决方案


在将 vuetify 添加到我现有的vue 应用程序时,我遇到了类似的错误。webpack安装指南对我有用。

注意:我是 Vue 和 Vuetify 的新手。如果我在以下步骤中做错了什么,请告诉我。

以下是一些亮点:

  1. 添加 vuetify 包:
$ npm install vuetify
  1. 创建一个 Vuetify 插件 js 文件,例如plugins/vuetify.js
import Vue from 'vue'
import Vuetify from 'vuetify'
import 'vuetify/dist/vuetify.min.css'

Vue.use(Vuetify)

const opts = { /* your vuetify options*/ }

export default new Vuetify(opts)
  1. 对于webpack,您可能还需要添加一些额外的包并在其中添加额外的配置部分webpack.config.js(请参阅webpack 安装指南)。如果您使用的是包裹,则可以跳过此步骤。

  2. 在您的入口点使用它,例如main.js

import Vue from 'vue'
import App from './App.vue'
import vuetify from './plugins/vuetify' // path to vuetify export

new Vue({
  el: '#app',
  vuetify,
  render: h => h(App)
})

<v-app>在以下位置设置您的 Vuetify App.vue

<template>
  <v-app>
    <v-main>
      <v-container>
        <v-card :elevation="2" class="mx-auto pa-6">
          <h1>Hello Vuetify from <code>{{ name }}</code></h1>
        </v-card>
      </v-container>
    </v-main>
  </v-app>
</template>

<script>
const App = {
    data: function() {
        return {
            name: 'App'
        }
    }
}
export default App
</script>

推荐阅读