Unknown plugin "transform-runtime" ...

[iamvitali]

Hi, I've installed vue-fuse & did import VueFuse from 'vue-fuse'.

Getting this error on npm run dev:

 error  in ./node_modules/vue-fuse/src/VueFuse.vue

Module build failed: ReferenceError: Unknown plugin "transform-runtime" specified in "C:\\xampp\\htdocs\\portal\\node_mo
dules\\vue-fuse\\.babelrc" at 0, attempted to resolve relative to "C:\\xampp\\htdocs\\portal\\node_modules\\vue-fuse"
    at C:\xampp\htdocs\portal\node_modules\babel-core\lib\transformation\file\options\option-manager.js:180:17
    at Array.map (native)
    at Function.normalisePlugins (C:\xampp\htdocs\portal\node_modules\babel-core\lib\transformation\file\options\option-
manager.js:158:20)
    at OptionManager.mergeOptions (C:\xampp\htdocs\portal\node_modules\babel-core\lib\transformation\file\options\option
-manager.js:234:36)
    at OptionManager.init (C:\xampp\htdocs\portal\node_modules\babel-core\lib\transformation\file\options\option-manager
.js:368:12)
    at File.initOptions (C:\xampp\htdocs\portal\node_modules\babel-core\lib\transformation\file\index.js:212:65)
    at new File (C:\xampp\htdocs\portal\node_modules\babel-core\lib\transformation\file\index.js:135:24)
    at Pipeline.transform (C:\xampp\htdocs\portal\node_modules\babel-core\lib\transformation\pipeline.js:46:16)
    at transpile (C:\xampp\htdocs\portal\node_modules\babel-loader\lib\index.js:49:20)
    at C:\xampp\htdocs\portal\node_modules\babel-loader\lib\fs-cache.js:118:18
    at ReadFileContext.callback (C:\xampp\htdocs\portal\node_modules\babel-loader\lib\fs-cache.js:31:21)
    at FSReqWrap.readFileAfterOpen [as oncomplete] (fs.js:366:13)

 @ ./node_modules/vue-fuse/src/VueFuse.vue 4:2-215
 @ ./node_modules/vue-fuse/index.js
 @ ./node_modules/babel-loader/lib?{"cacheDirectory":true,"presets":[["env",{"modules":false,"targets":{"browsers":["> 2
%"],"uglify":true}}]]}!./node_modules/vue-loader/lib/selector.js?type=script&index=0!./resources/assets/js/components/pa
ge-layout/leftSidebar.vue
 @ ./resources/assets/js/components/page-layout/leftSidebar.vue
 @ ./resources/assets/js/app.js
 @ multi ./resources/assets/js/app.js ./resources/assets/sass/vendor.scss ./resources/assets/sass/app.scss

[iamvitali]

On my side temporary fixed it with npm i babel-plugin-transform-runtime --save-dev & npm i babel-preset-stage-2 --save-dev

But I don't have enough knowledge to fix it in VueFuse and do a PR. :/

[shayneo]

Thanks for reporting @iamvitali are you on version 1.2.1 or 1.2.0?

I found a similar issue with v 1.2.0 and fixed in 1.2.1

[iamvitali]

"_id": "vue-fuse@1.2.1",

:)

[shayneo]

cool, are you importing into main.js or directly into a vue component?

[shayneo]

@iamvitali i couldn't replicate in a test project, perhaps you could share an example that is exhibiting this issue?

[daverogers]

I had the same issue; was importing into my main JS file

[shayneo]

Hey @daverogers ! Thanks for reporting. Would you mind posting your main.js file so I can try to replicate?

[daverogers]

I just ran it without anything else that could possibly cause conflict, really simple:

import Vue from 'vue'
import VueFuse from 'vue-fuse'

Vue.use(VueFuse)

.babelrc

{
    "presets": ["es2015"]
}

package.json

{
  "version": "1.0.0",
  "private": true,
  "main": "admin/src/app.js",
  "dependencies": {
    "axios": "^0.16.2",
    "g": "^2.0.1",
    "moment": "2.18.1",
    "sweet-modal-vue": "^2.0.0",
    "vue": "^2.4.4",
    "vue-fuse": "^1.2.1",
    "vue-stash": "^2.0.1-beta",
    "vue2-filters": "^0.2.1"
  },
  "devDependencies": {
    "@types/chai": "^4.0.4",
    "@types/mocha": "^2.2.43",
    "@types/node": "^8.0.32",
    "avoriaz": "^4.2.0",
    "babel-cli": "^6.26.0",
    "babel-loader": "^7.1.2",
    "babel-preset-env": "^1.6.0",
    "babel-preset-es2015": "^6.24.1",
    "cash-dom": "^1.3.5",
    "chai": "^4.1.2",
    "css-loader": "^0.28.7",
    "eslint-plugin-html": "^3.2.2",
    "fast-sass-loader": "^1.3.0",
    "jsdom": "^11.3.0",
    "jsdom-global": "^3.0.2",
    "mocha": "^3.5.3",
    "mocha-webpack": "^0.7.0",
    "node-sass": "^4.5.3",
    "vue-loader": "^13.0.5",
    "vue-style-loader": "^3.0.3",
    "vue-template-compiler": "^2.4.4",
    "webpack": "^3.8.1"
  },
  "scripts": {
    "build": "webpack --config webpack.config.js",
    "watch": "webpack --config webpack.config.js --progress --colors --watch",
    "test": "mocha-webpack --webpack-config webpack.test.config.js test/*.ts --recursive --require test/.setup.ts",
    "production": "NODE_ENV='production' webpack --config webpack.config.js"
  }
}

[shayneo]

Looks like some other Vue plugins have had this issue, check out the thread here: ratiw/vuetable-2#41