迁移Webpack时出现此错误。
以下是我的webpack.config.js。我还附有错误截图。
请查收附件。

我已经添加了sass-loader,css-loader,style-loader。
如果我做错了什么,请告诉我。

不确定是什么错误。
预先感谢您的帮助reactjs - 模块解析失败:意外字符'@'您可能需要适当的加载程序来处理此文件类型。(Webpack:4.4.0)-LMLPHP
Webpack.config.js

 const path = require("path");
    const HtmlWebpackPlugin = require("html-webpack-plugin");
    const CleanWebpackPlugin = require("clean-webpack-plugin");

    const settings = {
      distPath: path.join(__dirname, "dist"),
      srcPath: path.join(__dirname, "src")
    };


    function srcPathExtend(subpath) {
      return path.join(settings.srcPath, subpath)
    }

    module.exports = (env, options) => {
      const isDevMode = options.mode === "development";

      return {
        devtool: isDevMode ? "source-map" : false,
        resolve: {
          extensions: [".ts", ".tsx", ".js"],
        },
        module: {
          rules: [
            {
              test: /\.tsx?$/,
              use: ["babel-loader", "ts-loader", "tslint-loader"]
            },
            {
              test: /\.scss$/,
              use: [
                "style-loader",
                {
                  loader: "css-loader",
                  options: {
                    sourceMap: isDevMode
                  }
                },
                {
                  loader: "postcss-loader",
                  options: {
                    plugins: [
                      require("autoprefixer")()
                    ],
                    sourceMap: isDevMode
                  }
                },
                {
                  loader: "sass-loader",
                  options: {
                    sourceMap: isDevMode
                  }
                }
              ]
            },
            {
              test: /\.(ttf|eot|woff|woff2)$/,
              use: {
                loader: "file-loader",
                options: {
                  name: "fonts/[name].[ext]",
                },
              },
            },
            {
              test: /\.(jpe?g|png|gif|svg|ico)$/i,
              use: [
                {
                  loader: "file-loader",
                  options: {
                    outputPath: "assets/"
                  }
                }
              ]
            },
            {
              test: /\.js$/,
              exclude: /node_modules/,
              use: [
                'babel-loader'
              ]
            }

          ]
        },
        plugins: [
          new CleanWebpackPlugin([settings.distPath], {
            verbose: true
          }),
          new HtmlWebpackPlugin({
            template: srcPathExtend("index.ejs")
          })
        ]
      };
    };

最佳答案

取代这个

{
  test: /\.(ttf|eot|woff|woff2)$/,
     use: {
       loader: "file-loader",
         options: {
         name: "fonts/[name].[ext]",
     },
  },
}


有了这个代码

{
  test: /\.(woff|woff2|eot|ttf|svg)$/,
  loader: 'url-loader?limit=100000'
}


首先安装url-loader软件包

关于reactjs - 模块解析失败:意外字符'@'您可能需要适当的加载程序来处理此文件类型。(Webpack:4.4.0),我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/51961646/

10-11 04:13
查看更多