Webpack import 'bootstrap/dist/css/bootstrap.css' reported an error


/ / current path
/ / current path
const path = require ("path");
const webpack = require (" webpack");
const HtmlWebpackPlugin = require ("html-webpack-plugin");
module.exports = {

devtool:"eval-source-map", //
mode: "development", // "production" | "development" | "none"
entry: {
    main: "./src/js/main.js",
    test: "./src/js/page/test.js"
}, //
output: {
    path: path.resolve(__dirname, "dist/js"), // . Node.js  path 
    filename: "[name].js", //
},
module: {
    // 
    rules: [
        {
            test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
            loader: "url-loader?limit=8192&name=images/[hash:8].[name].[ext]",
        },{
            test: /\.(mp4|webm|ogg|mp3|wav|flac|aac)(\?.*)?$/,
            loader: "url-loader",
            options: {
                limit: 10000,
            }
        },{
            test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
            loader: "url-loader",
            options: {
                limit: 10000,
            }
        },{
            test: require.resolve("jquery"),
            use: [{
                loader: "expose-loader",
                options: "jQuery"
            }, {
                loader: "expose-loader",
                options: "$"
            }]
        }, {
            test: /\.(woff|woff2)(\?v=\d+\.\d+\.\d+)?$/,
            use: "url?limit=10000&mimetype=application/font-woff"
        }, {
            test: /\.ttf(\?v=\d+\.\d+\.\d+)?$/,
            use: "url?limit=10000&mimetype=application/octet-stream"
        }, {
            test: /\.eot(\?v=\d+\.\d+\.\d+)?$/,
            use: "file"
        }, {
            test: /\.svg(\?v=\d+\.\d+\.\d+)?$/,
            use: "url?limit=10000&mimetype=image/svg+xml"
        }, {
            test:  /\.(scss|sass)$/,
            use: [
            {
                loader: "style-loader"
            }, {
                loader: "css-loader",
                options: {
                    modules: true
                }
            },{
                loader: "sass-loader"
            }]
        },{
            test:/\.css$/,
            exclude: /node_modules/,
            include: [
                path.resolve(__dirname, "not_exist_path")
            ],
            use:["style-loader","css-loader"]
        }
    ]
},
plugins: [
    new webpack.ProvidePlugin({
        $: "jquery",
        jQuery: "jquery",
    })
]

}
entry main.js
import "src/css/test.css" the reference here has an effect
import" bootstrap/dist/css/bootstrap.css" add more this line reports an error

cannot find the problem. I"ve been looking it up on the Internet for a long time.

Apr.02,2021

obviously, the module- > rules configuration in your webpack . For css , remove exclude , because your bootstrap is contained in node_modules

.
MySQL Query : SELECT * FROM `codeshelper`.`v9_news` WHERE status=99 AND catid='6' ORDER BY rand() LIMIT 5
MySQL Error : Disk full (/tmp/#sql-temptable-64f5-1b40001-2c4cd.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
MySQL Errno : 1021
Message : Disk full (/tmp/#sql-temptable-64f5-1b40001-2c4cd.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
Need Help?