Webpack和webpack dev服务器不提供静态文件

Question

在过去，我已经能够在开发过程中提供静态文件，但是现在我似乎无法再这样做了，因为最新版本的webpack和webpack-dev-server的{{1 }和4.6.0。

如果我检查我的chrome检查器（ Ctrl + Shift + I ） - ＆gt; 3.1.3标签，并在Sources标签和Network下查看，我只能看到两个条目：

• （索引）
• bundle.js

我应该在那里看到我想要服务的图片文件，但我不知道。当我在我的控制台中看到类似的东西时，它真的很令人沮丧：

localhost:8080

但实际上，实际上并没有提供任何服务。感觉相当背叛。

无论如何，这些是我的文件：

文件夹结构

• 资产
• node_modules
• SRC
• 的package.json
• 包lock.json
• webpack.config.js

webpack.config.js

Content not from webpack is served from C:\Users\PC-user\WebstormProjects\untitled/assets/

Answer 1

尝试如下更改开发服务器设置

  const path = require('path');
  devServer: {
    contentBase: path.join(__dirname, 'dist'),
    compress: true,
    open: true,
    port: 3000,
    historyApiFallback: true,
    hot: true,
    publicPath: '/',
  },

Answer 2

也遇到了麻烦。但这有所帮助。

devServer: {
        publicPath : '/public'
    }

为我工作。公共文件在哪里，我的静态文件在哪里。