从tsx源码抽离出CSS文件，怎么通过 style-loader 等进行处理?

（在说正事之前，我要推荐一个福利：你还在原价购买阿里云、腾讯云、华为云服务器吗？那太亏啦！来这里，新购、升级、续费都打折，能够为您省60%的钱呢！2核4G企业级云服务器低至69元/年，点击进去看看吧>>>)

我的需求是从 tsx 代码中抽离样式到独立的 css 文件，再把样式文件经过 style-loader, css-loader 等进行处理。

目前我开发了一个 loader，做到了解析修改源码和生成 css 内容

export default function (source) {
  const webpackEnv = this
  
  // 修改源码，抽离 css
  const { code, css } = transform(source)
  
  // 获取输出路径
  const context = webpackEnv.rootContext
  const outputPath = interpolateName(webpackEnv, '[contenthash].[ext]',
    {
      context,
      content: source
    }
  )
  
  // TODO: 将 css 文件经过 style-loader 处理
  webpackEnv.emitFile(outputPath, css)
  
  // 返回源码
  return code
}

我遇到的是问题是：
1、调用 webpack 的 emitFile api 没有生成 css 文件
2、怎么将生成的文件通过 style-loader, css-loader 处理
3、怎么将处理后的文件链接到 html 文件中