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

Question

我的需求是从 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 文件中