Posted in Uncategorized

Support for default loader (file-loader) for unknown modules

   February 23, 2021  2 Comments on Support for default loader (file-loader) for unknown modules

Feature request

from facebook/create-react-app#667 (comment):

A catchall unknown-source loader feels like it would be pretty beneficial.
My opinion is that you want it managed by webpack in some way or another.

What is the expected behavior?

Non-javascript files without loader will be handled by file-loader, this can be configured in module.fallbackLoader.

What is motivation or use case for adding/changing the behavior?

Nowadays you need to list all of extensions yourself:

{
  test: /\.(json|css|jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$/,
  loader: "file-loader",
}

How should this be implemented in your opinion?

// webpack.config.js

module.exports = {
  module: {
    fallbackLoader: {
      loader: "url-loader",
    }
  }
}

Are you willing to work on this yourself?
yes

Author: Fantashit

2 thoughts on “Support for default loader (file-loader) for unknown modules”

  2. make sense, now it works, that solves problem for me, thanks for help, final config:

    const MiniCssExtractPlugin = require("mini-css-extract-plugin");

module.exports = {
  module: {
    rules: [
      {
        oneOf: [
          {
            test: /\.js$/,
            exclude: /node_modules/,
            loader: "babel-loader"
          },
          {
            test: /\.css$/,
            use: ["mini-css-extract-plugin/dist/loader.js", "css-loader"]
          },
          {
            exclude: /\.(js|mjs|json|wasm)$/,
            use: "file-loader"
          }
        ]
      }
    ]
  },
  plugins: [new MiniCssExtractPlugin()]
};

    Webpack block

Comments are closed.