【问题标题】:Webpack ERROR - You may need an appropriate loader to handle this file type, currently no loaders are configured to process this fileWebpack 错误 - 您可能需要适当的加载程序来处理此文件类型,目前没有配置加载程序来处理此文件
【发布时间】:2021-02-26 20:06:51
【问题描述】:

我正在学习使用 Webpack 构建我的 react 项目。 我已经配置了一个 webpack.config.js 来加载 CSS 文件。

webpack.config.js:

module.exports = {

  ...

  module: {
    rules: [

      {
        test: /\.css$/,
        exclude: /(node_modules)/,
        use: [
          { loader: 'style-loader' },
          { loader: 'css-loader' },
        ],
      },
      {
        test: /\.scss$/,
        exclude: /(node_modules)/,
        use: [
          { loader: 'style-loader' },
          { loader: 'css-loader' },
          { loader: 'sass-loader' },
        ],
      },

     ...

    ],
  },
  
  ...

}

npm 运行构建

出现了这个问题。

Module parse failed: Unexpected token (6:3) 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 |  * Copyright 2011-2020
Twitter, Inc. |  * Licensed under MIT
(https://github.com/twbs/bootstrap/blob/main/LICENSE)
>  */:root{--blue:#007bff;--indigo:#6610f2;--purple:#6f42c1;--pink:#e83e8c;--red:#dc3545;
.....  ```

我不明白该怎么做。谢谢。

【问题讨论】:

    标签: reactjs webpack webpack-4


    【解决方案1】:

    不知道为什么要排除 node_modules 为什么还要从那里导入 css,这意味着只需删除 exclude: /(node_modules)/ 然后就可以了:

    {
      test: /\.css$/,
      // exclude: /(node_modules)/, // Remove this 
      use: [
        { loader: 'style-loader' },
        { loader: 'css-loader' },
      ],
    },
    

    【讨论】:

    • 谢谢你成功了。我使用 exclude node_modules 的原因是因为这是从另一个教程复制的 webpack 配置。
    猜你喜欢
    • 2021-04-19
    • 2021-08-11
    • 2020-01-15
    • 2021-11-21
    • 1970-01-01
    • 2020-06-22
    • 2021-07-18
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多