• As wrong as it feels, your entry point for processing your CSS should be a Javascript file.
• Webpack by default does not output a separate stylesheet file. In order to output a plain CSS file, you must use the MiniCssExtractPlugin.
• Despite wanting to output only CSS, and specifying the filename in the options (style.css), Webpack will create an empty Javascript file regardless. There isn't a way to prevent this unless you add another plugin. I'm adding it to .gitignore.
• The "use" plugins have the following roles
  • MiniCssExtractPlugin: Exact built css to a dedicated css file.
  • css-loader: Allow you to import css from your entrypoint Javascript file
  • postcss-loader: Run postcss with your 

// webpack.config.js
const path = require('path');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');

const tailwindConfig = {
  entry: "./css/index.js",
  output: {
    path: path.resolve(__dirname, "../static/tailwind/"),
  },
  plugins: [
    new MiniCssExtractPlugin({ 
        filename: "style.css"
    }),
  ],
  module: {
   rules: [
    {
      test: /\.css$/,
        use: [
          MiniCssExtractPlugin.loader,
          { loader: "css-loader", options: { importLoaders: 1 } },
          "postcss-loader",
        ],
    },
   ],
  },
}
module.exports = [tailwindConfig]

// postcss.config.js
module.exports = {
  plugins: [
    require("tailwindcss")("./tailwind.config.js"),
    require("autoprefixer"),
  ]
}

// package.json
{
  ...
  "scripts": {
    "build": "NODE_ENV=production webpack --mode=production"
  }
  ...
}