Vue загрузка всех кусков по первому запросу - PullRequest
Новая
       17

Vue загрузка всех кусков по первому запросу

0 голосов
/ 03 декабря 2018

Я изучаю Vue и только что дошел до главы о маршрутизации.Я могу создать шаблонный проект с vue / cli с начальной конфигурацией маршрутизатора.Это код маршрутизатора: 

export default new Router({
  mode: 'history',
  base: process.env.BASE_URL,
  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'),
    },
  ],
});

В соответствии с комментариями к коду и документам этого должно быть достаточно для отложенной загрузки компонента About.

Когда япопробуйте загрузить страницу приложения, извлекается скрипт about.js:

About code not lazy loaded

Если я перехожу к пункту «О браузере», он извлекает скрипт из кеша диска:

enter image description here

Я запутался.Я ожидал увидеть скрипт about.js, загруженный только после перехода на страницу About.Я что-то упустил?

1 Ответ

0 голосов
/ 04 декабря 2018

Обсуждение , на которое указал @TJWeems, было очень разъяснительным.

Я получил ожидаемое поведение после отключения плагина предварительной выборки с помощью цепочки веб-пакетов.Я просто создал vue.config.js в моем корневом каталоге (так же, как package.json) со следующим: 

module.exports = {
    chainWebpack: (config) => {
        config.plugins.delete('prefetch');
    }
};

Просто чтобы вспомнить, я сделал это радилюбопытство.Я, вероятно, оставлю плагин prefetch включенным в будущих проектах и ​​просто рассмотрю возможность его отключения в определенных ситуациях.

...