javascript - Use raw-loader to read css files into strings, but the reading is unsuccessful

Question

Because the css file needs to be imported, it is processed in the form of a string in js.

Use raw-loader to test and read txt, css, and js files. Only css reading failed. Please solve it. Only the background-color of the body is set in the css file.

import str from 'raw-loader!./style.css';
console.log('read css file-------------------------------------');
console.log(typeof str, str);

Configured in webpack.base.conf.js

Answer 1

webpack configuration

entry:{
        "case7":__dirname+'/index.js',
    },
    output:{
        path: __dirname+'/dist',
        filename:'[name].js',
    },
    module: {
        rules: [
            {
                test: /\.css$/,
                use: 'raw-loader'
            }
        ]
    }

Import css files into index.js

import txt from './file.css'
console.log(txt);

Run results

Answer 2

Correct answer upstairs

Just import is followed by the css file name, and webpack will automatically use raw-loader to process it according to the suffix name of the file