VueJS + Webpack Dev Server не может выполнить горячую перезагрузку URL-путей. - PullRequest
Новая
       7

VueJS + Webpack Dev Server не может выполнить горячую перезагрузку URL-путей.

0 голосов
/ 09 сентября 2018

Мое приложение работает в подкаталоге http://localhost:8080/admin_suffix

suffix - это переменная ENV, которую я могу изменить и определить в файле .env.

После запуска сервера разработки веб-пакетов доступ к http://localhost:8080/admin_suffix работает.

Работает также нажатие на гиперссылки в SPA, которые указывают на другие подпути. Например, я могу перейти к http://localhost:8080/admin_suffix/subdirectory

Однако, когда я нажму reload на http://localhost:8080/admin_suffix/subdirectory, я получу сообщение об ошибке «Cannot GET / admin_suffix / subdirectory»

Я также не могу ввести подпуть в браузер напрямую, чтобы загрузить страницу. Работает только `` http://localhost:8080/admin_suffix`.

Моя конфигурация следующая:

webpack.base.config.js: 

  entry: {
    main: './src/main',
    vendors: './src/vendors'
  },
  devServer: {
        host: '0.0.0.0',
        disableHostCheck: true
  },
  output: {
    path: path.join(__dirname, '../dist')
  }

webpack.dev.config.js: 

module.exports = merge(webpackBaseConfig, {
  output: {
    publicPath: '/',
    filename: '[name].js',
    chunkFilename: '[name].chunk.js'
  }
});

SRC / main.js: 

const RouterConfig = {
    mode: 'history',
    routes: Routers,
    base: '/admin_suffix/'
}

1 Ответ

0 голосов
/ 25 сентября 2018

Включить devServer.historyApiFallback в webpack.base.config.js: 

devServer: {
  historyApiFallback: true,
  // ...
},

Это настраивает webpack-dev-server для возврата к index.html, когда маршрут не найден (404).

Приложение Vue и маршрутизатор инициализируются с главной страницы (index.html), поэтому при обновлении страницы в подпутье обычно получается 404, поскольку маршрутизатор еще не настроен. Однако указанная выше резервная конфигурация приведет к тому, что вместо этого будет обслуживаться index.html, что позволит настроить маршрутизатор и впоследствии выполнить подпорт.

...