Maison > Questions et réponses > le corps du texte
<磷>module : { règle:[ { Test : /.(js|ts|tsx)$/, Exclure : /node_modules/, utiliser: { chargeur : 'ts-loader', }, },磷>磷>
P粉4251197392023-09-15 19:32:01
Donc, j'ai trouvé la solution, créez d'abord bootstrap.scss séparé dans ce fichier .scss et importez bootstrap.css (dans mon cas, j'ai juste besoin de la grille de bootstrap) :
@import 'bootstrap/dist/css/bootstrap-grid.min.css';
Pour les fichiers sass ou scss, ces paramètres doivent être dans webpack.configuration.js :
return merge(filteredConfig, { entry: './src/moduleEntry.tsx', plugins: [ new ESLintPlugin({ extensions: ['js', 'jsx', 'ts', 'tsx'] }), new MiniCssExtractPlugin({ filename: `${moduleName}.css`, }), ], module: { rules: [ { test: /\.s[ac]ss$/i, use: [ // Creates `style` nodes from JS strings !isProduction ? 'style-loader' : MiniCssExtractPlugin.loader, // Translates CSS into CommonJS { loader: 'css-loader', options: { modules: { auto: true, localIdentName: '[local]-[hash:base64:5]', }, }, }, // Compiles Sass to CSS 'sass-loader', ], }, ...] }
Ces modifications mettront votre fichier .scss en mode production, le fusionneront en un seul fichier .css et placeront le CSS de Bootstrap dans le style.css exact de votre module.