Importing font awesome CSS into web component (FASTElement)

I am trying to include the Font Awesome CSS into a https://www.fast.design/docs/api/fast-elementindustrial furniture like this:

import { css } from '@microsoft/fast-element';
import { Theme } from '../../theme';
import * as style from '../../assets/fontawesome/css/all.css';

export const styles = css`
  ${style}  
  :host {
    contain: content;
    display: flex;
    flex-direction: row;
    border: 2px solid ${Theme.primaryColor};
    width: 512px;
    height: 256px;
  }
`;

I think the CSS needs to be a string, so I tried to do this by updating my webpack.config.js, which looks like this:

const HtmlWebpackPlugin = require('html-webpack-plugin');
const path = require('path');

module.exports = function (env, { mode }) {
  const production = mode === 'production';
  return {
    mode: production ? 'production' : 'development',
    devtool: production ? 'source-map' : 'inline-source-map',
    entry: {
      app: './src/main.ts',
      fa: './src/assets/fontawesome/css/all.css'
    },
    output: {
      filename: '[name].[contenthash].bundle.js',
      publicPath: '/',
      clean: true
    },
    resolve: {
      extensions: ['.ts', '.js'],
      modules: ['src', 'node_modules']
    },
    devServer: {
      port: 9000,
      historyApiFallback: true,
      open: !process.env.CI,
      devMiddleware: {
        writeToDisk: true,
      },
      static: {
        directory: path.join(__dirname, './')
      }
    },
    plugins: [
      new HtmlWebpackPlugin({
        template: './index.html'
      }),
    ],
    module: {
      rules: [
        {
          test: /\.ts$/i,
          use: [
            {
              loader: 'ts-loader'
            }
          ],
          exclude: /node_modules/
        },
        {
          test: /\.css$/i,
          use: ['style-loader', 'css-loader'],
        },
      ]
    }
  }
}

I modified my config following this stackoverflow post:

{
    test: /\.css$/,
    use: [
        'to-string-loader',
        'css-loader'
    ]
}

...but that has the effect of causing the Font Awesome icons outside of my component to stop rendering altogether, and the icons inside the component render as square boxes, which might have something to do with fonts.

Has anyone managed to import Font Awesome into web components in general and FASTElements in particular?