无法在React JSX组件中导入CSS文件

import React from 'react';

const MyComponent = () => {
  const styles = {
    container: {
      backgroundColor: 'blue',
      color: 'white',
      padding: '10px',
    },
  };

  return (
    <div style={styles.container}>
      This is my component.
    </div>
  );
};

export default MyComponent;

npm install --save-dev css-loader style-loader

module.exports = {
  // ...
  module: {
    rules: [
      {
        test: /\.css$/,
        use: ['style-loader', 'css-loader'],
      },
    ],
  },
};

import React from 'react';
import styles from './MyComponent.module.css';

const MyComponent = () => {
  return (
    <div className={styles.container}>
      This is my component.
    </div>
  );
};

export default MyComponent;