Vue2 - Ленивая загрузка на уровне маршрута не работает? - PullRequest
Новая
       51

Vue2 - Ленивая загрузка на уровне маршрута не работает?

0 голосов
/ 01 апреля 2020

В настоящее время я тестирую Vue. js, и мне интересно, что это из-за ленивых способностей загрузки. Возможно, я ошибаюсь, но, похоже, это не работает как надо.

Что я сделал:

Я создал новый проект с помощью Vue CLI 3 "vue create vtest ", затем я добавил 2 новых компонента и добавил их в роутер как asyn c компонент с именем чанка веб-пакета. Vue в руководстве по коду из его начального шаблона относительно разделения кода говорит:

router / index.ts

// this generates a separate chunk (about.[hash].js) for this route // which is lazy-loaded when the route is visited.

Поэтому я ожидаю, что при посещении одного из этих маршрутов будет лениво. Они не будут загружаться, если я не посещаю их. Ну, они загружаются в любом случае, например, когда я посещаю только оригинальный компонент Home, который на самом деле не использует один из моих 3 разделенных, разделенных кодом маршрутов, которые называются About, Foo и Bar. Но, как вы можете видеть на моем скриншоте, который показывает все запросы, загружает компонент Home.

enter image description here

Вот мои маршруты: 

const routes = [
  {
    path: '/',
    name: 'Home',
    component: Home,
  },
  {
    path: '/about',
    name: 'About',
    // route level code-splitting
    // this generates a separate chunk (about.[hash].js) for this route
    // which is lazy-loaded when the route is visited.
    component: () => import(/* webpackChunkName: "about" */ '../views/About.vue'),
  },
  {
    path: '/foo',
    name: 'Foo',
    component: () => import(/* webpackChunkName: "foo" */ '../views/Foo.vue'),
  },
  {
    path: '/bar',
    name: 'Bar',
    component: () => import(/* webpackChunkName: "bar" */ '../views/Bar.vue'),
  },
];

Вот мой репозиторий, с очень незначительными отличиями от стартового шаблона CLI Vue:

https://github.com/hellokvn/vue-test

1 Ответ

1 голос
/ 01 апреля 2020

Это может быть предварительная загрузка этих ленивых фрагментов загрузки. Можно отключить предварительную выборку, если вы хотите проверить ее дальше.

ref: предварительная выборка

...