无法使用webpack/next.js加载SCSS文件
我正在尝试使用next.config.js设置SASS加载程序,但在服务器重新启动后,我的.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
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...