为什么 localhost 在 public 目录下找不到 bundle.js？

Question

我正在尝试创建一个已经为我创建的 server.coffee 文件的 React 应用程序。我设置了 babel 和 webpack 并创建了 index.js 和 app.js 文件。我在 index.html 上添加了 bundle.js 的脚本标签。当我在本地主机上的运行服务器时，我不断收到错误消息：无法加载资源：服务器响应 bundle.js:1 的状态为 404（未找到）。我在本地目录中看到了该文件。我错过了什么？

HTML 文件：

<!DOCTYPE html>
<html>
  <head>
    <link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet">
    <link href="/static/base.css" rel="stylesheet">
    <script defer src="./bundle.js"></script>
  </head>
  <body>
    <div id="app"></div>
  </body>
</html>

我的网络包：

module.exports = {
  entry: ['@babel/polyfill','./client/index.js'],
  mode: 'development',
  output: {
    path: __dirname,
    filename: './public/bundle.js'
  },
  devtool: 'source-maps',
  module: {
    rules: [
      {
        test: /\.js$/,
        exclude: /node_modules/,
        use: {
          loader: 'babel-loader'
        }
      }
    ]
  }
}

我的.babelrc:

{
  "presets": ["@babel/preset-react", "@babel/preset-env"]
}

我的目录结构：

client
|-index.js
|-App.js
public
|-bundle.js
|-index.html
.babelrc
package.json
server.coffee
webpack.config.js

这是我运行宁的脚本：

  "scripts": {
    "start": "coffee server.coffee",
    "start-dev": "webpack -w & coffee server.coffee"
  }

最后这是我的 server.coffee 文件中的 app.get：

# Default public
app.get '/', (req, res) ->
  res.sendFile __dirname + '/public/index.html'

这又是我遇到的错误。 GET http://localhost:3000/bundle.js net::ERR_ABORTED 404（未找到）

终端上没有编译错误或任何内容。只有控制台错误。任何帮助表示赞赏！我知道如何完成项目的其余部分，但如果没有 React 运行ning.

是不可能的

Answer 1

您需要在 app.get() 路线之前使用 express.static()。

app.use(express.static('public'))

或者在 Coffeescript 中

app.use express.static 'public'

为什么 localhost 在 public 目录下找不到 bundle.js？

Why can't localhost find bundle.js even though it is in the public directory?

javascript

node.js

reactjs

coffeescript