How to fix: this.setDynamic is not a function

Question

There is some problem with my babel config, not sure what it is..

Error I am seeing:

 ERROR  Failed to compile with 1 errors                                                                                          friendly-errors 21:27:50


 ERROR  in ./.nuxt/client.js                                                                                                     friendly-errors 21:27:50

Module build failed (from ./node_modules/@nuxt/webpack/node_modules/babel-loader/lib/index.js):                                  friendly-errors 21:27:50
TypeError: this.setDynamic is not a function

my .babelrc looks like this:

{
  "presets": [
    [
      "vue-app",
      {
        "useBuiltIns": true
      }
    ],
    "flow"
  ],
  "plugins": ["@babel/plugin-proposal-decorators", "@babel/plugin-proposal-class-properties"],
  "env": {
    "test": {
      "plugins": ["babel-jest-assertions", "transform-runtime"]
    }
  }
}

Package-lock, installed plugins:

"@babel/core": "^7.4.5",
    "@babel/preset-env": "^7.4.5",
    "@nuxtjs/google-analytics": "^2.2.0",
    "acorn": "^6.1.1",
    "axios": "^0.18.1",
    "babel-jest-assertions": "^0.1.0",
    "babel-plugin-transform-decorators-legacy": "^1.3.5",
    "babel-preset-flow": "^6.23.0",

What needs to be changed for this config to work? Have visited various stackoverflow answers, and have not found a working fix yet.

UPDATED CONFIG AFTER COMMENTS:

"@babel/plugin-transform-runtime": "^7.4.4",
    "@babel/polyfill": "^7.4.4",
    "@vue/babel-preset-app": "^3.0.0-rc.2",
    "autoprefixer": "^7.1.2",
    "babel-core": "^6.26.3",
    "babel-eslint": "^8.2.3",
    "babel-helper-vue-jsx-merge-props": "^2.0.3",
    "babel-jest": "^21.0.2",
    "babel-loader": "^8.0.0-beta.0",
    "babel-plugin-dynamic-import-node": "^1.2.0",
    "babel-plugin-syntax-jsx": "^6.18.0",
    "babel-plugin-transform-es2015-modules-commonjs": "^6.26.0",
    "babel-plugin-transform-imports": "^1.5.1",
    "babel-plugin-transform-runtime": "^6.23.0",
    "babel-plugin-transform-vue-jsx": "^3.5.0",
    "babel-preset-env": "^1.3.2",
    "babel-preset-stage-2": "^6.22.0",
    "babel-register": "^6.22.0",

install it and add it to your plugins `"plugins": ["@babel/plugin-transform-runtime"...]` — Train, Jun 08 '19 at 01:39
@OrthoHomeDefense yes I do. still see the same error after confirming and re-running — Joshua, Jun 08 '19 at 01:40
you should upgrade "transform-runtime" to "@babel/plugin-transform-runtime" make sure it's greater v7 or greater uninstall babel-plugin-transform-runtime and install @babel/plugin-transform-runtime and make sure to install @babel/runtime — Train, Jun 08 '19 at 01:42
@OrthoHomeDefense updated the question with the new config.. still seeing the same error `Module build failed (from ./node_modules/@nuxt/webpack/node_modules/babel-loader/lib/index.js): friendly-errors 21:47:09 TypeError: this.setDynamic is not a function` — Joshua, Jun 08 '19 at 01:49
@OrthoHomeDefense update.. docker took the commit after these plugins where installed and pushed. it let me know that i was missing a plugin hopefully that is the fix. will post in here if it is — Joshua, Jun 08 '19 at 02:52
You have a ton of babel 6 specific dependencies listed there. You'll need to find their babel 7 equivalents. — Ohgodwhy, Jun 08 '19 at 07:00
@Ohgodwhy and comments.. updated config still seeing the same problem dependencies [`"@babel/core": "^7.4.5", "@babel/preset-env": "^7.4.5", "@babel/runtime": "^7.4.5", "@nuxtjs/google-analytics": "^2.2.0", "acorn": "^6.1.1", "axios": "^0.18.1", "babel-jest-assertions": "^0.1.0", "babel-plugin-transform-decorators-legacy": "^1.3.5", "babel-preset-flow": "^6.23.0",`] dev dependencies [`"@babel/plugin-syntax-jsx": "^7.2.0", "@babel/preset-flow": "^7.0.0", "babel-plugin-transform-imports": "^1.5.1",`] — Joshua, Jun 08 '19 at 12:10
@JoshuaPaulsen you should delete your babel config and all babel modules from pacakge.json, delete lock file and node_modules and reinstall — Aldarund, Jun 08 '19 at 14:49
`babel-jest-assertions` relies on `babel 6`. You're still using `babel 7`.. — Ohgodwhy, Jun 08 '19 at 16:14
@Ohgodwhy removed babel-jest-assertions still seeing the same error. `Module build failed (from ./node_modules/babel-loader/lib/index.js): friendly-errors 16:36:11 TypeError: this.setDynamic is not a function` [packege.json] `"@babel/core": "^7.4.5", "@babel/preset-env": "^7.4.5", "@babel/runtime": "^7.4.5", "@nuxtjs/google-analytics": "^2.2.0", "acorn": "^6.1.1", "axios": "^0.18.1", "babel-plugin-transform-decorators-legacy": "^1.3.5", "babel-preset-flow": "^6.23.0",` — Joshua, Jun 09 '19 at 20:37
You're using `babel-plugin-transform-decorators-legacy`, which relies on babel 6. You need to go through *all* of your babel dependencies and upgrade them. — Ohgodwhy, Jun 09 '19 at 22:09
@Ohgodwhy here is the current config [devDependencies]`"babel-core": "6.26.3", "babel-plugin-transform-imports": "^1.5.1",` .babelrc `{ "presets": [ [ "vue-app", { "useBuiltIns": true } ], "flow" ], "plugins": ["transform-decorators-legacy", "transform-class-properties", "transform-imports"], "env": { "test": { "plugins": ["babel-jest", "@babel/plugin-transform-runtime"] } } }` its very very basic now yet, still seeing the same error... `Module build failed TypeError: this.setDynamic is not a function` — Joshua, Jun 10 '19 at 01:50
Now you've reverted BACK to Babel 6.26.3 and have Babel 7 dependencies mixed in. — Ohgodwhy, Jun 10 '19 at 15:46

score 4 · Answer 1 · answered Jun 11 '19 at 19:48

4

The answer to this problem is this. Be aware of your babel configuration, ie like mentioned in the comments. Babel 6 will not work correctly with Babel 7 plugins and etc. Thank you for all the provided help in the comments.

answered Jun 11 '19 at 19:48

Joshua

481
6
21

How to fix: this.setDynamic is not a function

1 Answers1