vue-router не загружает / не отображает компоненты? - PullRequest
Новая
       5

vue-router не загружает / не отображает компоненты?

0 голосов
/ 26 июня 2018 
import Vue from 'vue';
import Router from 'vue-router';

//
// Application routes
//

const appRoutes = []

//
// let's add 404 page
// in the case we have landed on non-processed URL
//
import PageNotFound  from '@/lib/components/page-not-found';

appRoutes.push({
  path:      '*',
  name:      'PageNotFound',
  component: PageNotFound,
  meta:      {
    layout: 'DefaultLayout',
  },
});

Vue.use(Router);

export default new Router({
  mode:               'history',
  saveScrollPosition: true,
  routes:             appRoutes,
});

Такой код ничего не отображает в браузере, когда я нажимаю на любой URL (поскольку маршрутизатор настроен для path '*'), однако, если я заменяю на асинхронную загрузку 

appRoutes.push({
      path:      '*',
      name:      'PageNotFound',
      component: () => import('@/lib/components/page-not-found'),
      meta:      {
        layout: 'DefaultLayout',
      },
    });

тогда все начинает работать.

Дисплеи Chrome на консоли НЕТ ошибок 

2865:├─┬ eslint-plugin-vue@4.5.0
2866:│ └─┬ vue-eslint-parser@2.0.3
3912:├─┬ jest-serializer-vue@1.0.0
5629:│ └── vue-resize@0.4.4
5631:├── vue@2.5.16
5632:├─┬ vue-alertify@1.0.5
5640:│ └── vue@2.5.16 deduped
5641:├── vue-autosuggest@1.4.1
5642:├── vue-axios@2.1.1
5643:├── vue-class-component@6.2.0
5644:├── vue-error-boundary@1.0.1
5645:├── vue-extend-layout@1.1.2
5646:├── vue-head@2.0.12
5647:├─┬ vue-highlightable-input@1.0.5
5652:├── vue-i18n@7.8.1
5653:├─┬ vue-jest@2.6.0
5675:│ └── vue-template-es2015-compiler@1.6.0
5676:├─┬ vue-loader@14.2.3
5693:│ ├── vue-hot-reload-api@2.3.0
5694:│ ├── vue-style-loader@4.1.0 deduped
5695:│ └── vue-template-es2015-compiler@1.6.0 deduped
5696:├─┬ vue-meta@1.5.0
5700:├── vue-momentjs@0.1.2
5701:├─┬ vue-multi-select@3.5.1
5702:│ └── vue@2.5.16 deduped
5703:├── vue-progress-path@0.0.2
5704:├─┬ vue-property-decorator@6.1.0
5706:│ └── vue-class-component@6.2.0 deduped
5707:├─┬ vue-resize-directive@1.0.1
5710:├─┬ vue-responsive-components@0.2.3
5713:├── vue-router@3.0.1
5714:├─┬ vue-routisan@2.1.1
5715:│ └── vue-router-multiguard@1.0.3
5716:├── vue-select@2.4.0
5717:├── vue-spinner@1.0.3
5718:├─┬ vue-style-loader@4.1.0
5721:├─┬ vue-styled-components@1.2.3
5746:├── vue-svg-sprite@1.2.3
5747:├── vue-table-component@1.9.1
5748:├─┬ vue-template-compiler@2.5.16
5751:├── vue-toasted@1.1.24
5752:├── vue-truncate-filter@1.1.7
5753:├── vue-upload-component@2.8.9
5754:├── vue2-filters@0.3.0
5755:├─┬ vue2-sentry@1.2.1
5757:│ └── vue@2.5.16 deduped
5758:├── vue2-transitions@0.2.3
5759:├─┬ vuejs-uploader@0.6.5
5760:│ └── vue@2.5.16 deduped
5761:├── vuex@3.0.1
5762:├── vuex-cache@1.1.1
5763:├── vuex-class@0.3.1
5764:├── vuex-loading@0.3.0
5765:├─┬ vuex-search@2.2.1

Есть идеи?

1 Ответ

0 голосов
/ 27 июня 2018

Так что мне пришлось бежать 

vue init webpack

и затем начал перемещать код из проекта из одной папки в другую, в самом конце все работало просто отлично без каких-либо изменений кода

Когда я копировал папки одну за другой, я проверял, компилируется ли код с простым HelloWorld компонентом, сгенерированным vue init, затем начал импортировать конфиги, хранилища и т. Д., И, наконец, все работало с не асинхронным импортом компонент в конфигурации роутера.

До того, как я начал новый проект путем клонирования папки (cp -R), возможно, это была проблема.

...