【问题标题】：Next js import scss error(ModuleParseError: Module parse failed: Unexpected character '�' (1:0))Next js import scss error(ModuleParseError: Module parse failed: Unexpected character '�' (1:0))
【发布时间】：2020-03-16 19:35:15
【问题描述】：

我的问题是

当我在 'ProjectFolder/components/header/Header.js' 中导入如下 scss 文件时

（那个 Header.js 位于同一个 'pages' 目录 level.v ）

import "../../public/assets/scss/_reset.scss";

引发此错误..

我也像这样创建 next.config.js。

// next.config.js setting
const withSass = require('@zeit/next-sass');
module.exports = withSass();

还有我的 package.json

听说'/'路径自动解析'public'目录...

所以我也试过了

import "/assets/scss/_reset.scss";

但同样的问题已经发布..

我能知道为什么..？

感谢您的阅读:)

【问题讨论】：

标签： reactjs sass next.js

【解决方案1】：

我解决了这个问题！更改 next.config.js！

const withSass = require('@zeit/next-sass');
const withCSS = require("@zeit/next-css");
module.exports = withCSS(withSass({
    webpack(config, options) {
        config.module.rules.push({
            test: /\.(png|jpg|gif|svg|eot|ttf|woff|woff2)$/,
            use: {
                loader: 'url-loader',
                options: {
                    limit: 100000
                }
            }
        });

        return config;
    }
}));

【讨论】：

【解决方案2】：

您是否使用 BOM（字节顺序标记）创建文件检查文件编码并使用纯文本编辑器检查文件以删除 BOM。如果文件需要采用该编码（可能是 utf-8），您可以尝试使用来自 npm 的 webpack-utf8-bom

【讨论】：

utf-8 没问题 ..ㅠㅠ 不过谢谢你的关注 :)