原因是我在webpack.config.js 配置loader时 写成 这种写法是错误的

test:’/.css$/'

正确写法应该是去掉引号 下面是正确写法

var path = require("path");
module.exports = {
    entry:"./src/index.js",
    output:{
        filename:"bundle.js",
        path:path.resolve(__dirname,"dist")
    },
    mode:"development",
    module:{
        rules:[
            {
                test:/\.css$/,
                use:['style-loader','css-loader']
            }
        ]
    },
}

为了从 JavaScript 模块中 import 一个 CSS 文件，你需要在 module 配置中 安装并添加 style-loader 和 css-loader：

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

这样你就可以在index.js文件中使用 import “./style.css” 文件了

import "./style.css"
  function component() {
    var element = document.createElement('div');

  // Lodash, currently included via a script, is required for this line to work
    // Lodash, now imported by this script
    element.innerHTML = _.join(['Hello', 'webpack练习'], ' ');

    return element;
  }
  document.body.appendChild(component());