'Webpack babel-loader runtime: Module build failed: TypeError: this.setDynamic is not a function
I'm trying to use the babel-loader with the babel-plugin-transform-runtime.
I've followed the instructions at: https://github.com/babel/babel-loader#babel-is-injecting-helpers-into-each-file-and-bloating-my-code
The relevant code:
rules: [
// the 'transform-runtime' plugin tells babel to require the runtime
// instead of inlining it.
{
test: /\.js$/,
exclude: /(node_modules|bower_components)/,
use: {
loader: 'babel-loader',
options: {
presets: ['@babel/preset-env'],
plugins: ['@babel/transform-runtime']
}
}
}
]
And I get the following error on build:
Module build failed: Error: Cannot find module '@babel/plugin-transform-runtime'
If I'm changing the plugin name to: plugins: ['transform-runtime'], I get the following error:
Module build failed: TypeError: this.setDynamic is not a function
What is the problem?
Solution 1:[1]
First, as @yccteam pointed one needs to have installed
npm install --save-dev @babel/plugin-transform-runtime
npm install --save @babel/runtime
.babelrc file should have
{
"presets": [
["@babel/preset-env", {
"debug": false,
"modules": false,
"useBuiltIns": false
}],
"@babel/preset-react"
],
"plugins": [
"@babel/syntax-dynamic-import",
"@babel/plugin-transform-runtime",
[ "@babel/plugin-proposal-class-properties", { "loose": true } ],
"@babel/transform-async-to-generator"
],
"env": {
"production": {
"presets": ["react-optimize"]
}
}
}
webpack.js file should look like
module: {
rules: [
{
test: /(\.js[\S]{0,1})$/i,
exclude: /node_modules/,
loader: 'babel-loader',
query: {
presets: ['@babel/preset-react', '@babel/preset-env'],
plugins: ['@babel/proposal-class-properties']
},
},
...
Solution 2:[2]
Your webpack entry looks the same as the example, so I wonder what happens if you use .babelrc.
{
"plugins": ["transform-runtime"]
}
Do you have the env preset installed as well?
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|---|
| Solution 1 | |
| Solution 2 |
