Question

[ error ] ./node_modules/font-awesome/css/font-awesome.css 7:0
Module parse failed: Unexpected character '@' (7:0)
You may need an appropriate loader to handle this file type, currently no loaders are 
configured to process this file. See https://webpack.js.org/concepts#loaders
| /* FONT PATH
|  * -------------------------- */
> @font-face {
|   font-family: 'FontAwesome';
|   src: url('../fonts/fontawesome-webfont.eot?v=4.7.0');

我已经安装了next-css，我的next.config.json是：

const withCSS = require("@zeit/next-css");
module.exports = withCSS({});

Answer 1

来自https://github.com/zeit/next-plugins/issues/432：

将next-css与url-loader，file-loader和css-loader一起与next.config.json一起安装可解决此问题。

const withCSS = require('@zeit/next-css')

module.exports = withCSS({
  webpack: function (config) {
    config.module.rules.push({
      test: /\.(eot|woff|woff2|ttf|svg|png|jpg|gif)$/,
      use: {
        loader: 'url-loader',
        options: {
          limit: 100000,
          name: '[name].[ext]'
        }
      }
    })
    return config
  }
})

我也有一个名为.next.config.json：P的next.config.json文件，因此使用next.config.json时，错误应改为ModuleParseError: Module parse failed: Unexpected character ' ' (1:0)。

NextJS模块解析失败：意外字符'@'（7：0）

1 个答案: