Question

我已经更新了Vuetify（1.5-> 2.1.6），Vue（2.5-> 2.6.10）和<v-app> <v-content> <v-container>是未知的自定义元素，但是没有其他vuetify组件。为什么呢

这是我的树枝模板

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>{% block title %}Phoenix{% endblock %}</title>
        <link rel="shortcut icon" type="image/x-icon" href="{{ asset('bundles/assetcms/img/favicon-cms.ico') }}" />
        <script src="https://maps.googleapis.com/maps/api/js?key={{ googleApiKey }}&language=fr&libraries=places"></script>
        {% if not app.debug %}
            <link href="{{ asset('build/css/main.css') }}" type="text/css" rel="stylesheet" />
        {% endif %}

        {% block stylesheets %}{% endblock %}
    </head>
    <body{% if block("body_id") is defined %} id="{% block body_id %}{% endblock %}"{% endif %}>
        <div id="app">
            <v-app>
                {% block body %}{% endblock %}
            </v-app>
            <input id="siteLocale" type="hidden" value="{{ app.request.locale }}">
        </div>
        {% if app.debug %}
            <script src="http://localhost:3001/build/app.js"></script>
        {% else %}
            <script src="{{ asset('build/js/mods.vendors.js') }}?{{ 'now'|date('U') }}"></script>
            <script src="{{ asset('build/js/app.js') }}?{{ 'now'|date('U') }}"></script>
        {% endif %}

        {% block javascripts %}{% endblock %}
    </body>
</html>

这是我的app.js

import Vue from 'vue';
import vuetify from './plugins/vuetify';
import Vuex from 'vuex';
import './scss/layout.scss';

import VTooltip from 'v-tooltip';
import VueTheMask from 'vue-the-mask';
import VueScrollTo from 'vue-scrollto';

import Notifications from 'vue-notification';
import VeeValidate from 'vee-validate';
import VueI18n from 'vue-i18n';
import VuetifyConfirm from 'vuetify-confirm';
import VueUploadComponent from 'vue-upload-component';

import translation from './translation/trad.json';
import components from './modules/components.maps';

let siteLocale;
const localeEl = document.getElementById('siteLocale');
if (localeEl) {
    siteLocale = localeEl.getAttribute('value');
}
siteLocale = siteLocale && siteLocale !== '' ? siteLocale : 'fr';

/* Init i18n */
Vue.use(VueI18n);
const i18n = new VueI18n({
    locale: siteLocale,
    messages: translation
});

/* Form validate */
const veeValidateConfig = {
    events: 'blur',
    inject: false,
    i18n: i18n,
    i18nRootKey: 'vue_validators',
    locale: 'fr'
};
Vue.use(Vuex);
Vue.component('app-tag');
Vue.component('file-upload', VueUploadComponent);
Vue.use(VeeValidate, veeValidateConfig);
Vue.use(Notifications);
Vue.use(VTooltip);
Vue.use(VueTheMask);
Vue.use(VueScrollTo, {
    container: '.content-container'
});

Vue.use(VuetifyConfirm, {
    buttonTrueText: i18n.t('button.yes'),
    buttonFalseText: i18n.t('button.no'),
    color: 'error',
    icon: 'warning',
    title: i18n.t('validation.delete.title'),
    width: 350,
    property: '$confirm'
});


new Vue({
    vuetify,
    components,
    i18n,
    store: new Vuex.Store()
}).$mount('#app');

我的vuetify.js

import Vue from 'vue';
import Vuetify from 'vuetify/lib';

Vue.use(Vuetify);

const opts = {};

export default new Vuetify(opts);

有人可以帮助我吗？非常感谢

<v-app> / <v-content> / <v-container>是未知的自定义元素

0 个答案: