После сборки vue-cli приложение не отображается должным образом - PullRequest
0 голосов
/ 07 ноября 2018

Я использую последнюю версию vue-cli, и все работает в разработке.

После того, как я собрал его, первая страница приложения не отображается должным образом, остальные страницы работают нормально.

Вот как это выглядит на dev:

enter image description here

и вот как это выглядит на продукт:

enter image description here

Используя инструменты разработки, я вижу, что элементы не отображаются должным образом, поэтому я все еще вижу фактический компонент (например, <aq-filters>) вместо просто div:

enter image description here

Как я уже говорил, это происходит только для этой одной страницы, остальное работает нормально.

Нет ошибки во время сборки или в консоли.

Вот часть кода, который может иметь отношение:

import { createNamespacedHelpers } from "vuex";

import DomainModal from "./AddDomainModal";
import {
  PageHeader,
  AqFilters,
  AqEmptyPage,
  AqAsync,
  AqAccordionList,
  AqAccordionItem,
  AqGrid,
  AqSelectionActions,
  TenantStatusCell
} from "comp";

const { mapGetters, mapActions } = createNamespacedHelpers("domains");

...

components: {
    DomainModal,
    PageHeader,
    AqFilters,
    AqEmptyPage,
    AqAsync,
    AqAccordionList,
    AqAccordionItem,
    AqGrid,
    AqSelectionActions
  }

Есть идеи, что здесь происходит?

UPDATE

Я нашел решение, но не знаю, почему оно работает. В моем файле router.js я использовал динамический импорт для создания чанков, за исключением первой страницы (доменов), которую я импортировал статически:

{
   path: "/domains",
   name: "domains",
   component: DomainsPage,
   meta: { requiresAuth: true }
},

Как только я изменил его на динамический импорт, это решает проблему:

{
      path: "/domains",
      name: "domains",
      component: () =>
        import("@/views/domains/DomainsPage" /* webpackChunkName: "DomainsPage" */),
      meta: { requiresAuth: true }
    },

Кто-нибудь может это объяснить?

...