Webpack-dev-server показывает полное приложение с правильной маршрутизацией, но маршрутизация не работает на localhost - PullRequest
Новая
       16

Webpack-dev-server показывает полное приложение с правильной маршрутизацией, но маршрутизация не работает на localhost

0 голосов
/ 01 февраля 2019

Я работаю над тем, что должно быть простым приложением реагирования для компании (поэтому я не могу опубликовать очень много кода), и использую webpack-dev-server для горячей замены, чтобы ускорить процесс разработки.Когда я запускаю свое приложение на webpack-dev-server для целей разработки, я могу использовать все приложение с маршрутизацией, работающей так, как следует в производственной среде.Когда я попытался запустить то же самое приложение на localhost: 8080, я смог увидеть мой основной экран входа в систему, а затем домашнюю страницу, но после этого ни одна из маршрутизации не работает, и я постоянно вижу «Не удается получить / домой» и т. Д.что является новым поведением.

Каждый вопрос о переполнении стека, который я обнаружил, касался прямо противоположной проблемы, когда webpack-dev-server не показывает все, что является localhost, и ничего, что я нашел и попробовал, не сработало.

Я уже пытался перегенерировать bundle.js, чтобы убедиться, что все изменения были подобраны, и я просмотрел свой webpack.config.js, чтобы убедиться, что там ничего не изменилось (кроме моих дополнений).поддержать горячую замену, которую я сделал несколько недель назад).Chrome Inspector не показывает ошибок, поэтому я действительно в растерянности относительно того, почему приложение не работает на локальном хосте, а не на webpack-dev-server.

В конце концов, все, что я хочу, это для моего приложения реагированиявыглядеть на localhost так же, как на сервере dev, и я не могу понять, почему это не так.

webpack.config.js: 

module.exports = {
    entry: [
        './src/index.js'
    ],
    output: {
        path: __dirname+'/public',
        publicPath: '/',
        filename: 'bundle.js'
    },
    module: {
        loaders: [{
            exclude: /node_modules/,
            loader: 'babel',
            query: {
                presets: ['react', 'es2015', 'stage-1']
            }
        },{
            test: /\.(s*)css$/,
            loader: combineLoaders([
                {
                    loader: 'style-loader'
                }, {
                    loader: 'css-loader',
                    query: {
                        modules: true,
                        localIdentName: '[name]__[local]___[hash:base64:5]'
                    }
                }, {
                    loader: 'sass-loader'
                },
            ])
        },
        ],
    },
    resolve: {
        extensions: ['', '.js', '.jsx']
    },
    devServer: {
        historyApiFallback: true,
        contentBase: './'
    },
    watch: true,
    watchOptions: {
        aggregateTimeout:300,
        poll: 1000,
        ignored: /node_modules/
    }
};

1 Ответ

0 голосов
/ 15 февраля 2019

Нашел мою проблему - он жил в server.js.Главный ответ на этот вопрос помог: Как правильно обслуживать производственную реакцию bundle.js, созданную webpack?

Необходимо заменить: 

app.get(['/', '/bom', '/items', '/products', '/segmentation'], function (req, res) {
    res.sendFile('index.html', {root: __dirname});
});

на:

app.get('*',function(req,res) {
    res.sendFile(path.resolve(__dirname,'public/index.html'));
});

И это исправило мою проблему с рендером localhost.

...