Hello I have a project which uses react, typescript, and webpack. Previously I had some errors which caused the code to not compile but now when it is fixed, webpack does serve the HTML file on localhost:8000 but nothing else, so no CSS, or any scripts, here is my webpack.config if you think the issue might be somewhere else just ask and I will make an update thank you.

const path = require("path");

module.exports = {
  entry: "./src/index.tsx",
  mode: "development",
  module: {
    rules: [
      {
        test: /\.css$/,
        exclude: /(node_modules)/,
        use: [{ loader: "style-loader" }, { loader: "css-loader" }],
      },
      {
        test: /\.json$/,
        use: "json-loader",
      },
      {
        test: /\.(ts)x?$|\.d\.ts$/,
        exclude: /node_modules|\.d\.ts$/,
        use: {
          loader: "ts-loader",
        },
      },
    ],
  },
  devServer: {
    static: {
      directory: path.join(__dirname, "public"),
    },
    compress: true,
    port: 8080,
  },
  resolve: {
    extensions: [".tsx", ".ts", ".js"],
    modules: ["src", "node_modules"],
    fallback: {
      fs: false,
      tls: false,
      net: false,
      path: require.resolve("path-browserify"),
      zlib: false,
      http: false,
      https: false,
      stream: false,
      crypto: false,
    },
  },
  experiments: {
    topLevelAwait: true,
  },
  output: { path: `${__dirname}/build`, filename: "bundle.js" },
};

CodePudding user response：

Change to output.path to output.path: path.resolve(__dirname, 'dist/build'),. Hope this helps!

CodePudding user response：

My HTML didn't utilize the script, which caused a webpack to filter it and not serve it because it wasn't used.