SCSS文件无法通过webpack / next.js加载

Question

我正在尝试使用next.config.js设置SASS加载器，但是服务器重启后，我的.scss类将被忽略。我的文件配置不正确吗？任何关于我可能需要添加的设置的输入都将受到赞赏。

// next.config.js
const withCSS = require("@zeit/next-css");
const withSASS = require("@zeit/next-sass");

const webpack = require("webpack");
const apiKey = JSON.stringify(process.env.SHOPIFY_API_KEY);

module.exports = withCSS(withSASS({
  webpack: config => {
    const env = { API_KEY: apiKey };
    config.plugins.push(new webpack.DefinePlugin(env));
    config.module.rules.push({
      test: /\.(woff(2)?|ttf|eot|svg)(\?v=\d+\.\d+\.\d+)?$/,
      use: [
        {
          loader: 'file-loader',
          options: {
            name: '[name].[ext]',
            outputPath: 'fonts/' // relative to main output path
          }
        }
      ]
    });


    config.node = {fs: "empty"};

    return config;
  }
  , cssModules: true
  , cssLoaderOptions: {
    importLoaders: 1,
    localIdentName: "[local]___[hash:base64:5]",
  }
  , sassLoaderOptions: {}
}));

// /pages._app.js
// none of the elements below are green with borders as a .card class should make them be

import "../adminStyles.scss";

// child component of index.tsx
<React.Fragment>
    <Card>
      <div className="card">

        <p className="instructionText card">Set</p>
// continues...