Can't resolve 'babel-loader'
I had the same problem; I fixed it by installing the babel-loader module:
yarn add -D babel-loader
or
npm install --save babel-loader
Mel
Updated on March 12, 2021Comments
-
Mel about 3 years
I am trying to configure my first node react app.
I keep getting an error that says "Can't resolve babel-loader".
Googling that error, I found a couple of suggestions which do not work.
The first is to add the following to my webpack.config.js
// resolveLoader: { // modulesDirectories: '/usr/local/lib/node_modules' // },
Trying that produces an error that says:
Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema. - configuration.resolveLoader has an unknown property 'modulesDirectories'. These properties are valid: object { alias?, aliasFields?, cachePredicate?, descriptionFiles?, enforceExtension?, enforceModuleExtension?, extensions?, fileSystem?, mainFields?, mainFiles?, moduleExtensions?, modules?, plugins?, resolver?, symlinks?, unsafeCache?, useSyncFileSystemCalls? }
The next suggestion is to try:
resolveLoader: { fallback: '/usr/local/lib/node_modules' },
That produces a similar error.
Does anyone have any advice on how to get started with this configuration. Understanding the documentation is proving difficult - every second word is jargon and I can't find a reference point to find fundamental understanding of what needs to be done to get started in this setup.
Webpack.config.js is:
module.exports = { entry: './app/app.jsx', output: { path: __dirname, filename: './public/bundle.js' }, resolve: { modules: [__dirname, 'node_modules'], alias: { Greeter: 'app/components/Greeter.jsx', GreeterMessage: 'app/components/GreeterMessage.jsx', GreeterForm: 'app/components/GreeterForm.jsx', }, extensions: ['.js', '.jsx'] }, // resolveLoader: { // fallback: '/usr/local/lib/node_modules' // }, module :{ rules:[{ // use : 'babel-loader', loader: 'babel-loader', query :{ presets:['react','es2015'] // ,'es2017' }, test: /\.jsx?$/, exclude: /(node_modules|bower_components)/ } ] } };
-
Julian K about 3 yearsshould it be yarn add -D babel-loader? Any reason you'd need this in production?
-
JESii about 3 yearsThanks, @JulianK -- I've fixed the answer!