How to use the styled-jsx/webpack.loader function in styled-jsx

webpack: (config, { defaultLoaders, isServer, dev }) => {
    // Fixes npm packages that depend on `fs` module
    config.node = {
      fs: 'empty',
      module: 'empty',
    }

    config.module.rules.push(
      {
        test: /\.css$/,
        use: [
          defaultLoaders.babel,
          {
            loader: require('styled-jsx/webpack').loader,
            options: {
              type: 'global',
            },
          },
        ],
      },
      {
        test: /\.svg$/,
        use: [
          {
            loader: '@svgr/webpack',
          },
        ],
      }
    )

webpack: (config, { defaultLoaders, isServer, dev }) => {
    // Fixes npm packages that depend on `fs` module
    config.node = {
      fs: "empty",
      module: "empty"
    };

    config.module.rules.push(
      {
        test: /\.css$/,
        use: [
          defaultLoaders.babel,
          {
            loader: require("styled-jsx/webpack").loader,
            options: {
              type: "global"
            }
          }
        ]
      },
      {
        test: /\.svg$/,
        use: [
          {
            loader: "@svgr/webpack"
          }
        ]
      }
    );

webpack: (config, { defaultLoaders }) => {
    config.module.rules.push({
      test: /\.scss$/,
      use: [
        defaultLoaders.babel,
        {
          loader: require('styled-jsx/webpack').loader,
          options: {
            type: 'scoped',
          },
        },
        'sass-loader',
      ],
    })

    return config
  },
}

use: {
      loader: 'url-loader',
      options: {
        limit: 8192,
        publicPath: './',
        outputPath: 'static/css/',
        name: '[name].[ext]'
      }
    }
  })
  config.module.rules.push({
    test: /\.styles$/,
    use: [
      defaultLoaders.babel,
      {
        loader: require('styled-jsx/webpack').loader,
        options: {
          type: 'scoped'
        }
      }
    ]
  })

  if (config.mode === 'production') {
    if (Array.isArray(config.optimization.minimizer)) {
      config.optimization.minimizer.push(new OptimizeCSSAssetsPlugin({}));
    }
  }

  if (options.isServer) config.plugins.push(new ForkTsCheckerWebpackPlugin())
  config.output.webassemblyModuleFilename = 'static/wasm/[modulehash].wasm'
  return config

{
          loader: "emit-file-loader",
          options: {
            name: "dist/[path][name].[ext]",
          },
        },
        "babel-loader",
        "webpack-glsl-loader",
      ],
    });
    config.module.rules.push({
      test: /\.s([ac])ss$/,
      use: [
        options.defaultLoaders.babel,
        {
          loader: styledJsxLoader.loader,
          options: {
            type: fileName => fileName.toLowerCase().indexOf("global") === -1 ? "scoped" : "global",
          },
        },
        {
          loader: "sass-loader",
          options: {
            includePaths: [
              "./",
            ],
          },
        },
        {
          loader: "sass-resources-loader",
          options: {
            sourceMap: true,