How do I use tailwindcss @apply directive inside a svelte component

This works:

<div class="list p-2" />

This doesn't work:

<style lang="postcss">  @tailwind base;  @tailwind components;  @tailwind utilities;  @layer components {    .list {      @apply p-2;    }  }</style>

I looked in Svelte's docs, but it explains the process with SvelteKit, which I'm not using. How can I make it work?

webpack.config.js:

...module: {rules: [  {    test: /\.css$/i,    use: ['style-loader', 'css-loader', 'postcss-loader'],  },

tailwind.config.js:

module.exports = {  purge: ['./*.html','./src/**/*.js','./src/**/*.svelte'  ],  darkMode: false, // or 'media' or 'class'  theme: {    extend: {},  },  variants: {    extend: {},  },  plugins: [],}

postcss.config.js:

module.exports = {  plugins: [    ['tailwindcss'],    ['autoprefixer'],  ],};