无法使用webpack/next.js加载SCSS文件

无法使用webpack/next.js加载SCSS文件,webpack,sass,next.js,Webpack,Sass,Next.js,我正在尝试使用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 = JS

我正在尝试使用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.\u app.js
//下面的元素没有一个是绿色的,带有边框。卡片类应该使它们是绿色的
导入“./adminStyles.scss”;
//index.tsx的子组件

设置

//继续。。。
// /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...