Babel Plugin/Preset files are not allowed to export objects, only functions
JavascriptWebpackBabeljsJavascript Problem Overview
I`m tryng to use Babel-loader on an old project, and i notice some issues regarding when babel loader is working on wrapped objects, is this its default behaviour ? I am not sure if this is a bug or something im doing wrong, i could not find much about it over google, so this is my last resource.
Would i need to change something to my code to make it work ?
This are my current specs: Webpack: 3.19.0 babel/core: 7.0.0-beta.34 babel-loader: 8.0.0-beta.0
Please refer to my packages.json if needed:
http://paste.ubuntu.com/26187880/
I`m tryng to load a single file wrapped in a function:
http://paste.ubuntu.com/26187814/
Resuming, something old, that is built like this:
( window.global = { } )();
This is my webpack config:
const webpackConfig = {
context: __dirname,
entry: {
app: '../../JavaScript/Namespacing.js'
},
module: {
rules: [
{
test: /.jsx?$/,
exclude: /(node_modules|bower_components)/,
use: {
loader: 'babel-loader',
}
}
]
},
output: {
path: __dirname + "/../../static/js",
filename: "[name].js"
},
plugins: [
new webpack.ProvidePlugin({
$: "jquery",
jQuery: "jquery",
"window.jQuery": "jquery"
})
],
}
And the error i get on my file is the following:
Plugin/Preset files are not allowed to export objects, only functions.
So, am i missing something ?
Thanks for any help.
Javascript Solutions
Solution 1 - Javascript
I got the same error with babel 7.x
and and "babel-loader": "^8.0.4"
I solved the issue by changing the following dependencies in package.json.
I got the solution from these link
"devDependencies": {
"@babel/core": "^7.1.6",
"@babel/preset-env": "^7.1.6",
"@babel/preset-react": "^7.0.0",
"babel-loader": "^8.0.4",
"webpack": "^4.25.1",
"webpack-cli": "^3.1.2"
}
and in .babelrc
{
"presets": ["@babel/env", "@babel/react"]
}
or in package.json
"babel": {
"presets": [
"@babel/env",
"@babel/react"
]
},
If you are using npm
then use the following
npm install @babel/core --save-dev
npm install @babel/preset-env --save-dev
npm install @babel/preset-react --save-dev
npm install babel-loader --save-dev
npm install webpack --save-dev
npm install webpack-cli --save-dev
If you are using yarn, then use the following
yarn add @babel/core --dev
yarn add @babel/preset-env --dev
yarn add @babel/preset-react --dev
yarn add babel-loader --dev
yarn add webpack --dev
yarn add webpack-cli --dev
Solution 2 - Javascript
From your package.json, I can see that you are using older plugins and presets meant for Babel v6, which will result in this error message. You need to switch to e.g., @babel/preset-env
, then update your .babelrc
accordingly (if you provide .babelrc
, more specific guidance can be given).
Here is a related ticket with some explanation - https://github.com/babel/babel-loader/issues/540
A few more semi-related notes on what I see in package.json
:
The old babel-core
dependency is still there. Remove this or update it to version 7.0.0-bridge.0
. Similarly, the old react preset is in there, remove it.
If you are using the env
preset, you do not need to use the es2015
preset at all. Remove it.
Solution 3 - Javascript
Babel has been moved its packages into its Scope Repository Since version 7.x .
the last version of babel packages (in main npmjs ) are :
"babel-core": "^6.26.3",
"babel-preset-env": "^1.7.0",
"babel-preset-react": "^6.24.1",
...
but you have to use The Continued version in @babel/ scoped repository:
by today these are :
"@babel/core": "^7.12.16",
"@babel/preset-env": "^7.12.16",
"@babel/preset-react": "^7.12.13",
...
so you have to uninstall and install them:
npm uninstall babel-core babel-preset-env babel-preset-react
npm install @babel/core @babel/preset-env @babel/preset-react
or :
yarn remove babel-core babel-preset-env babel-preset-react --dev
yarn add @babel/core @babel/preset-env @babel/preset-react --dev
> Note 1: you can add a @
and change first -
to /
>
> Note 2: note that, The babel-loader package is not in babel
> package, its a module for webpack to load babel. (it remains
> bebel-loader with latest version)
after changing babel to its scope you have to make required changes in the .babelrc
:
from:
"presets" : ["env","react"]
to :
"presets" : ["@babel/preset-env","@babel/preset-react"]
Solution 4 - Javascript
answers are for old versions. currently this set up is enough:
"presets": ["@babel/preset-env", "@babel/preset-react"],
if you are using this package "babel-preset-stage-0" on top of those you will still get same error. So uninstall "babel-preset-stage-0" and make sure your all babel packages are starts with "@babel" except "babel-loader". @babel indicates that the package is maintained by the babel team
Solution 5 - Javascript
Most of the packages were not even installed. So, this is the combination which actually worked. Remember to delete your node_modules before testing and changes in .babelrc is important. Updated devDependencies of package.json and .babelrc from.
Updated from:
1. Package.json file:
"devDependencies": {
"babel-core": "^6.26.3",
"babel-loader": "^7.1.5",
"webpack": "^4.41.2",
}
2. .babelrc file:
{
"presets": [
"env",
"react",
"es2015"
],
"plugins": [
"transform-class-properties",
"transform-object-rest-spread",
"transform-react-jsx"
]
}
Updated to:
1. Package.json file:
"devDependencies": {
"@babel/core": "^7.13.10",
"@babel/plugin-proposal-class-properties": "^7.8.3",
"@babel/preset-env": "^7.1.6",
"@babel/preset-react": "^7.0.0",
"babel-cli": "^6.26.0",
"babel-core": "^7.0.0-bridge.0",
"babel-loader": "^8.0.4",
"webpack": "^4.46.0"
}
2. .babelrc file:
{
"presets": ["@babel/preset-env", "@babel/react"],
"plugins": [
"transform-class-properties",
"transform-object-rest-spread",
"transform-react-jsx"
]
}
Solution 6 - Javascript
this worked for me:
npm uninstall --save babel-loader
npm uninstall --save @babel/core
npm install --save-dev babel-loader@^7
and in babelrc:
"presets" : ["env", "react"]