Webpack dev server связывает и компилирует, но не обновляет браузер - PullRequest
0 голосов
/ 08 мая 2019

Мой проект состоит из двух разных проектов:

  1. Проект SPA, использующий Webpack
  2. Внутренний проект, который загружает в него SPA

Я разместил webpack-dev-server для обслуживания на http://localhost:2902 и внутренний сервер на http://localhost/my-proj.Whenever Я запускаю webpack-dev-server, чтобы связать и просмотреть свои изменения, он корректно компилирует изменения, НО это необновите Интернет, и я должен сделать это вручную.

, например:

http://localhost/my-proj
<html>
  <head></head>
  <body>
    <div id="app"></div>
    <script type="text/javascript" src="http://localhost:2902/bundle.js"></script>
  </body>
</html>

Мой файл конфигурации разработки веб-пакета:

module.exports = {
    mode: 'development',
    devtool: 'cheap-module-eval-source-map',
    entry: [
        './App/app.js'
    ],
    output: {
        path: path.resolve(__dirname + '/dist'),
        filename: 'bundle.js',
        publicPath: '/'
    },
    watch:true,
    devServer: {
        inline: true,
        contentBase: false,
        compress: true,
        host: HOST || config.dev.host,
        port: PORT || config.dev.port,
        overlay:true,
        watchOptions: {
            aggregateTimeout: 300,
            poll: true,
        },
        headers: {
            "Access-Control-Allow-Origin": "*",
            "Access-Control-Allow-Methods": "GET, POST, PUT, DELETE, PATCH, OPTIONS",
            "Access-Control-Allow-Headers": "X-Requested-With, content-type, Authorization"
        }
    },

    module: {
        rules: [...]
    },

    plugins: [
        new MiniCssExtratPlugin({
            filename: '[name].css',
            chunkFilename: '[id].css'
        }),
        new VueLoaderPlugin(),
    ]
};

Я много читаювопросов и статей о моей проблеме, но я не мог понять, что не так с моей конфигурацией.

Webpack 4.30.0 Webpack Dev Server 3.3.1

...