在Webpack 4

Question

我正在MAMP端口8888上运行Apache和MySQL服务器。 这会在项目内的/templates文件夹中提供树枝文件，并且/web文件夹中包含由Webpack 4创建的bundle.js。

我希望能够观看/templates中对树枝文件的任何更改。

下面是我的webpack.config.js文件

const path = require('path');

module.exports = {
  entry: './src/index.js',
  mode: 'development',
  output: {
    path: path.join(__dirname, './web'),
    filename: 'bundle.js'
  },
  devServer: {
    host: 'localhost',
    port: 8888,
    //publicPath: path.join(__dirname, "./web"),
    contentBase: path.join(__dirname, "./templates"),
    watchContentBase: true
  }

当我运行webpack-dev-server时，我看到index.twig文件，并且bundle.js的内容也应用于页面。但是，当我更改树枝文件时，页面不会刷新。同样，更改文件会影响bundle.js（例如CSS文件），也不会触发刷新，但是我看到Webpack会重建bundle.js（当然在dev-server的内存中）。

但是，如果我添加一个简单的index.html文件并从配置文件中删除port:8888，以使其默认在端口8080上运行，那么我可以在编辑{{1}时触发页面刷新}或影响index.html

的CSS文件

我是从Webpack定位端口8888的问题吗，这也是MAMP所使用的。