Next-Sass не компилируется?

#reactjs #typescript #sass #next.js

#reactjs #typescript #sass #next.js

Вопрос:

Я следил за всем из примеров nextjs и не могу найти ничего неправильного…

Ошибка, выданная сервером разработки nextjs

Исправлено выше

/ Текущая проблема /

Похоже, next-sass не используется, когда он проходит через файл .scss, я не уверен, что происходит. Если я удалю импорт из моего файла SCSS, та же ошибка будет выдана для всего остального в файле.

Страница сейчас отображается, но ни один из SCSS не развертывается, и мой index.TSX теперь выдает

‘boot’ объявлен, но его значение никогда не считывается.ts(6133)

Next.config.js

 const withTypescript = require("@zeit/next-typescript");
const withSass = require("@zeit/next-sass");

module.exports = withTypescript(), withSass();
  

index.tsx

 import * as React from "react";
import * as ReactDOM from "react-dom";
import _ from "lodash";

import boot from "../node_modules/bootstrap/scss/bootstrap.scss"
import the from "../styles/theme_common.scss";
import MasterLayout from "../components/masterLayout.container";
  

Если кто-нибудь мог бы помочь мне решить эту проблему, это остановило разработку : (

Комментарии:

1. попробуйте import "../node_modules/bootstrap/scss/bootstrap.scss"

2. также это первый раз, когда я вижу такой способ экспорта модулей. Где вы это видели? Я хотел бы знать

3. Из github.com/zeit/next-plugins/tree/master/packages/… @evgenifotia. О, и я попытался импортировать его другим способом, но это просто возвращает меня к исходной проблеме.

Ответ №1:

Проблема в том, как вы экспортируете несколько модулей, попробуйте это

 const withTypescript = require("@zeit/next-typescript");
const withSass = require('@zeit/next-sass')
module.exports = withTypescript(withSass({
    cssModules: true
}))
  

и сделайте import "../styles/theme_common.scss"; то же самое для остальных

Ответ №2:

В документации, похоже, показан немного другой синтаксис для добавления поддержки SASS с помощью CSS.

https://github.com/zeit/next-plugins/tree/master/packages/next-sass#with-css-modules

 // next.config.js
const withSass = require('@zeit/next-sass')
module.exports = withSass({
    cssModules: true
})
  

Комментарии:

1. Я уже пробовал это, но по какой-то причине это работает сейчас? Я даже ничего не изменил… Как странно…

2. @Stryxus ранее вы не перезапускали сервер

3. Я перезагрузил сервер раньше, но теперь iv столкнулся с другой проблемой. Ни один из SCSS все еще не компилируется, и в файле TSX при импорте появляется ошибка, в которой говорится, что он не может найти модуль.

4. @Stryxus, из интереса, обязательна ли поддержка css? Из того, что вы предоставили, я не вижу загружаемых css-файлов.

5. О да, это уже было удалено, это было тестирование импорта bootstrap по URL. Я обновлю это сейчас.