Quiero personalizar el arranque según mis necesidades, y estoy tratando de usar el paquete web para inyectar mi CSS como una etiqueta de enlace.

he instalado:

• paquete web
• mini-css-extraer-plugin
• hablar con descaro a
• nodo-sass
• cargador sass
• cargador css

Y esto es lo que he probado hasta ahora:

 // I want to take the content of custom-bootstrap, and inject it as a link tag. { include: resolve('src/scss/custom-bootstrap.scss'), use: [ MiniCssExtractPlugin.loader, // 3. Injects the styles into a link tag. //"style-loader", // 3. Injects styles into the DOM. "css-loader", // 2. Turns css into js. "sass-loader", // 1. Turns sass into css. ] }

El contenido de custom-bootstrap.scss se ve así:

 @import "~bootstrap/scss/bootstrap";

También tengo otra regla de paquete web ( /\.(sc|c)ss$/i ) muy similar a la anterior que es para manejar cualquier otro estilo en la aplicación. Se parece a esto:

 { test: /\.(sc|c)ss$/i, exclude: resolve('src/scss/custom-bootstrap.scss'), use: [ // MiniCssExtractPlugin.loader, // 3. Injects the styles into a link tag. "style-loader", // 3. Injects styles into the DOM. "css-loader", // 2. Turns css into js. "sass-loader", // 1. Turns sass into css. ] }

Cuando ejecuto webpack me sale el siguiente error:

 Module build failed (from ./node_modules/sass-loader/dist/cjs.js): SassError: expected "{". ╷ 2 │ import API from "!../../../node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js";.

Alguien sabe cómo resolver esto? También traté de usar una ruta aa a node_modules en lugar de usar la sintaxis ~ en el archivo scss, pero sin suerte. Cualquier ayuda será apreciada. :)