javascript - Next.js 与 Sass 发生错误说 "You may need an appropriate loader to handle this file type error"-6ren

javascript - Next.js 与 Sass 发生错误说 "You may need an appropriate loader to handle this file type error"

转载作者：行者123 更新时间：2023-11-28 19:31:40

24

4

我多次尝试连接我的 next.js 和 scss，但它不起作用。

我想我已经设置好一切以使用 scss 编译我的文件。

错误说

/scss/style.scss 1:0
Module parse failed: Unexpected token (1:0)
You may need an appropriate loader to handle this file type.
> .example {
|   color: blue;
| }

代码如下:

next.config.js

const withSass = require("@zeit/next-sass");
module.exports = withSass();

_document.js

import Document, { Head, Main, NextScript } from "next/document";

export default class extends Document {
  render() {
    return (
      <html>
        <Head>

        <link rel="stylesheet" href="/_next/static/style.css" />
        <Head />
        <body>
          <Main />
          <div id="modal" />
          <NextScript />
        </body>
      </html>
    );
  }
}

index.js

import "../scss/style.scss";

import axios from "axios";

const Index = props => {
  return (
    <div>
      <div className="example">hello</div>
      <header>
        <Header />
      </header>
      <section>
        <Body stores={props.data} />
      </section>
      <footer>
        <Footer />
      </footer>
    </div>
  );
};

style.scss 在 SCSS 文件夹中

.example {
  color: blue;
}

最佳答案

尝试将 import "../scss/style.scss"; 添加到您的 _document.js。

关于javascript - Next.js 与 Sass 发生错误说 "You may need an appropriate loader to handle this file type error"，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/54882223/

24

4

0

文章推荐： javascript - 在 Javascript 中使用类变量

文章推荐： python - Python 脚本中 "for"循环的进度条

文章推荐： javascript - 试图找到合适的正则表达式

文章推荐： python - 如何在字符级别对句子进行单热编码？

c - 哪个更快 : Appropriate data input or appropriate data structure?
我有一个数据集，其列如下所示: Consumer ID | Product ID | Time Period | Product Score 1 | 1 | 1
java - 匿名内部类 : When are they (in)appropriate?
举个例子。有一个我想使用的对象，称它为 Doodad。 Doodad 元素对浏览器事件的处理很差。 Doodad 的典型实例是 Doodad someDoodad = new Doodad();。显然
java - 连接池 : is it appropriate
我正在构建一个基于 Java 的 Web 应用程序(主要是使用 Tomcat 部署的 JSP)。用户数量永远不会超过 30 人。它是一个工作日志，因此用户将不断更新/访问数据库 (SQL Server
Java继承问题: Determining appropriate subclass
我有一个名为 account 的抽象类，如下所示 - abstract class Account { private int number; private String owner
css - 响应字体大小 : Which values are appropriate?
我目前忙于响应式字体大小。我很清楚 vh、vw、vmin 等单位的含义。但我无法与他们一起完成令人信服的事情。它们要么在大屏幕上变大，要么在小屏幕上变小。反之亦然。是否有任何适用于哪些值的一般规则
oop - "No appropriate method"使用类定义对象调用新函数时产生错误
我定义了一个名为“FilterCriteria”的类，它有一堆与之关联的函数 .m 文件(getAMask、getBMask 等)。当我创建 FilterCriteria 对象并使用它调用函数时，我没
mongodb - 论坛类数据结构: NoSQL appropriate?
我正在尝试保存具有“类似论坛”结构的数据: 这是简化的数据模型: +---------------+ | Forum | | | | Name
java测试数据库结构: can't find an appropriate framework
我正在寻找一种在 Java 中验证数据库模式是否正常、默认值是否正常、触发器是否正常的方法。我找到了很多框架来测试数据库交互，但找不到可以让我测试表和模式的东西。有什么框架吗？如果数据库尚未同步，它将
825. Friends Of Appropriate Ages 适龄的朋友
题目地址：https://leetcode.com/problems/friends-of-appropriate-ages/description/ 题目描述： Some people will
rust - 调用lambda时“Cannot infer an appropriate lifetime”
我有以下代码: fn main() { let get = |v: &u32| -> &u32 { v }; let x : u32 = 0; let
java - 休息服务: select an appropriate method
在下面的代码中选择适当的 Web 服务方法的逻辑是什么？客户: HttpAuthenticationFeature feature = HttpAuthenticationFeature.basic
rust - 如何在不编辑函数签名的情况下更正 "cannot infer an appropriate lifetime"？
背景:我正在创建一个返回切片引用的迭代器 &[T] ，但数据向量需要保持不变。迭代器不能修改原始数据，但修改后必须重复返回同一个切片指针。我考虑过让我的迭代器拥有一个 Vec ，但我想避免这种情况(而
enums - "cannot infer an appropriate lifetime"使用闭包返回对枚举变量内容的引用
我有一个接受枚举引用的函数，我需要通过匹配枚举并读取其内容来解析它。枚举的一种变体(不在下面的简化的最小工作示例中)可能包含枚举本身的类型作为值，因此我可能需要递归调用相同的函数来解析它的值。我想编
MySQL 分区 : why it's not taking appropriate partition
DROP TABLE temp; CREATE TABLE `temp` ( `CallID` bigint(8) unsigned NOT NULL,
c++ - 错误 : no appropriate default constructor
无法编译以下内容。这里有什么问题吗？ class B; class A { public: void DoSomething() { ... B* my
javascript - 幸运之轮 : Select Appropriate DIV
我在 Wheel of Luck Game 中需要其他帮助。我需要在 6 个 div 中选择 3 个 DIV。但是如果我选择如下图所示的 div 会发生什么，它将分别选择 6 No DIV 而不是 5
C++ "No appropriate default constructor available"
我想在不使用 STL 的情况下创建一个数组链表。但是，我在将数组传递到我的链接列表时遇到困难... 编译时出现上面列出的错误。我需要如何将数组传递给链表？谢谢! (有问题的代码有**标记，如果测试请去
c# - LINQ左外连接查询错误: OuterApply did not have the appropriate keys
我正在使用 Entity Framework 作为我的 ORM 对两个 SQL 函数进行连接。执行查询时，我收到此错误消息: The query attempted to call 'Outer Ap
javascript - js错误: You may need an appropriate loader
我所做的只是导入一个 npm 包 import TimePicker from 'simple-timepicker-react' render () { return (
javascript - 无法导入模块 : You may need an appropriate loader
我有一个使用 bower 和 webpack 的 React 项目。我正在尝试使用这个模块 https://github.com/jrowny/react-absolute-grid . 我用 np

首页

博学

6Ren·AI

商城

javascript - Next.js 与 Sass 发生错误说 "You may need an appropriate loader to handle this file type error"