import/no-webpack-loader-syntax

webpack lets you put loader names in front of a path, separated by !. Bun, Node.js and most other bundlers can't resolve a path like that, so the file only works with webpack. It also scatters your build setup across your source files.

The rule reports any import, export .. from, import() or require() with a ! in its path.

Configure

Off by default. To turn it on:

[lint.rules]
"import/no-webpack-loader-syntax" = "error" # or "warn"

Examples

Reported:

import styles from "style-loader!css-loader!./app.css";
const notes = require("raw-loader!./notes.txt");

Not reported:

import styles from "./app.css";
const notes = require("./notes.txt");

Configure the loaders in webpack.config.js instead.