Next.jsでsassを使いたい。

Question

Next.jsでsassを使用したいのですが、どうしてもエラーが出てしまいます。

error - ./src/pages/_app.tsx
Module not found: Can't resolve 'assets/style.scss' in '/Users/....'

//_app.tsx
import React from "react";
import App, { AppContext } from "next/app";
import Head from "next/head";
import { MuiThemeProvider } from "@material-ui/core/styles";
import { theme } from "assets/theme";
import "assets/style.scss"; //読み込めてない
import Layout from "layout/app";

export default class extends App {
 .....

//next.config.js
require("dotenv").config();
const withSass = require("@zeit/next-sass");


module.exports = withSass({})

module.exports = {
  distDir: "../.next",
  env: {
    API_URL: process.env.API_URL,
  },
};

//package.json
"dev": "node src/server.ts",

//npm run devで起動

公式だとmodule.wsports = withSass({})で行けているのになぜかエラーになります。
解決策をご存知の方はどうかよろしくお願いします。

Comments

[maai]

以下も動かないという事でしょうか？
・"assets/style.scss" をcssに置き換えて動くかどうか
・_app.tsxではなく、nextjsのページに該当するtsxにscssを配置して動くかどうか

[2_34_koki]

両方ともだめですね

Answer 1

tsconfig.jsのbaseURLの向けている階層が問題だった