Estoy usando Storybook, Tailwind y Vue. Uno de mis componentes Vue tiene un estilo con lang="scss" y trató de usar @apply de Tailwind para diseñar. No hizo ningún efecto. Aunque funciona si se elimina lang="scss" . ¿Alguna idea de lo que falta en la configuración?

Buscar.vue

 <template> . . . <input type="search" placeholder="What are you searching for?" class=" bg-lightest-blue text-blue text-lg text-opacity-70 w-full focus:outline-none " /> . . . </template> // If lang="scss" is removed, it works <style lang="scss" scoped> input::placeholder { @apply text-blue; } </style>

libro de cuentos/main.js

 const path = require("path"); module.exports = { stories: ["../src/**/*.stories.mdx", "../src/**/*.stories.@(js|jsx|ts|tsx)"], addons: [ "@storybook/addon-links", "@storybook/addon-essentials", "@storybook/source-loader", ], framework: "@storybook/vue3", webpackFinal: async (config) => { // add SCSS support for CSS Modules config.module.rules.push({ test: /\.scss$/, use: ["style-loader", "css-loader?modules&importLoaders", "sass-loader"], include: path.resolve(__dirname, "../"), }); return config; }, };