Module parse failed: Unexpected token. You may need an appropriate loader to handle this file type
Webpack found syntax it can’t parse because no loader is configured for that file (JSX, TypeScript, CSS, or modern syntax in node_modules).
Module parse failed: Unexpected tokenYou may need an appropriate loader to handle this file type Meaning
Webpack needs loaders (babel-loader, ts-loader, css-loader). Packages shipping untranspiled modern syntax can also hit this in older webpack/babel setups.
Common causes
- Missing babel-loader/ts-loader rule
- JSX in .js files not covered by the rule
- CSS/images without loaders
- Dependency shipping newer syntax than your loader supports
⚡ Quick fix
- Add a rule for the file type
- Include the package in babel-loader’s transpiled modules
- Upgrade the toolchain (or move to Vite)
Detailed fix by platform
React
{ test: /\.[jt]sx?$/, exclude: /node_modules/, use: 'babel-loader' }
How to diagnose
- File — Which file and token?
- Loader — Is there a rule for it?
🔧 Still not fixed?
Many errors look alike. If the steps above didn’t solve it, one of these is probably what you’re facing:
Similar errors
Most viewed in React
- Objects are not valid as a React child Error: Objects are not valid as a React child
- No QueryClient set Error: No QueryClient set, use QueryClientProvider to set one
- Functions cannot be passed Error: Functions cannot be passed directly to Client Components unless you explicitly expose it by marking it with "use server".
Other ways to find it
Where this error sits
Origin: On your device. Errors that are often confused with or caused by this one (click to open):
🧠 Still stuck? Analyze your error
Paste the full message, response headers or stack trace — we'll detect the platform and point to the most likely cause.
💬 What worked for others
No tips yet — did something else fix this for you?
Share what worked for you
Tips are checked by an editor before they appear. Links are removed.
Report a correction or suggest an improvement
Last updated 14 Oct 2026