Почему Vue не находит компонент?

Question

[inavo]

Изучаю Vue, решил собрать тестовую сборку на webpack. Тестирую на локальном сервере.
Компоненты страниц представляют собой файлы .vue
Открываю сайт, компонент главной страницы нормально подключается, а если перейти на другую страницу, например /test, то ошика "Object not found!" компонент не подключается. При этом если открывать левую страницу типа /qwerty, то компонент страницы не найдено подключается.

Структура:

template
-- dist
-- -- build.js
-- src
-- -- app
-- -- -- components
-- -- -- -- шапка, футер etc
-- -- -- pages
-- -- -- -- test-data
-- -- -- -- -- test-data.vue
-- -- -- -- main
-- -- -- -- -- main.vue
-- -- -- -- page-not-found
-- -- -- -- -- page-not-found.vue
-- -- -- -- index.js
-- -- -- App.vue
-- -- -- app-routes.js
-- -- -- main.js
-- -- public
-- -- -- index.html
-- -- webpack.config.js
index.html

Конфиг вебпак:

const VueLoaderPlugin = require('vue-loader/lib/plugin');

module.exports = {
    mode: 'development',
    entry: __dirname + "/src/app/main.js", // webpack entry point. Module to start building dependency graph
    output: {
        path: __dirname + '/dist', // Folder to store generated bundle
        filename: 'build.js',  // Name of generated bundle after build
        publicPath: '/' // public URL of the output directory when referenced in a browser
    },
    module: {
        rules: [
            {
                test: /\.vue$/,
                loader: 'vue-loader'
            }, {
                test: /\.css$/,
                use: [
                    'vue-style-loader',
                    'css-loader'
                ]
            }
        ]
    },
    plugins: [
        new VueLoaderPlugin()
    ],
    devServer: {  // configuration for webpack-dev-server
        contentBase: './src/public',  //source of static assets
        port: 7700, // port to run dev-server
        historyApiFallback: true,
        hot: true
    }
};

src/app/app-routes.js:

import Vue from 'vue';
import Router from 'vue-router';

import { AppMainPage } from './pages';
import { AppPageNotFound } from './pages';
import { AppTestData } from './pages';

Vue.use(Router);

const appRoutes = [
    {
        path: '/',
        name: 'home',
        component: AppMainPage
    },
    {
        path: '/test',
        name: 'test',
        component: AppTestData
    },
    {
        path: '*',
        name: 'page-not-found',
        component: AppPageNotFound
    }
];

const routes = [...appRoutes];

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

Вот и пытаюсь понять, почему главная нормально, а /test нет?

Comments

[Дмитрий Беляев]

скорее всего ошибка падает тут:import { AppTestData } from './pages';
посмотрите, есть ли такой экспорт или реэкспорт в src/app/pages/index.js

[inavo]

Дмитрий Беляев, да одинаково они экспортятся

export { default as AppMainPage } from './main/main.vue';
export { default as AppPageNotFound } from './page-not-found/page-not-found.vue';
export { default as AppTestData } from './test-data/test-data.vue';

[inavo]

Дмитрий Беляев, на дев сервере всё работает

[inavo]

Дмитрий Беляев, создал папку /test и скопировал туда основной index.html заработало. Теперь думаю, как бы обойтись только одним физическим индексом.