32

So I've tried researching this but none of the solutions are working. I think it's an issue with some of my vue dependencies, potentially vue-loader, " but I'm not sure what to do to fix it. I have tried:

  • deleting node_modules and re-running npm install
  • npm update
  • I've tried removing vue-loader completely
  • tried adding, removing, and updating @vue/component-compiler-utils
  • tried changing the version of the above to three different things
  • tried running composer install and composer update
  • creating a new temp staging branch from master just in case it was some weird git error and building from that

What am I missing here? Every vue component on my staging site returns this same error. The weirdest thing is that the staging server is a direct clone of our production server, where everything works completely smoothly and I get zero errors.

The Errors:

ERROR in ./resources/assets/js/components/component.vue
Module build failed (from ./node_modules/vue-loader/lib/index.js):
TypeError: Cannot read property 'parseComponent' of undefined
    at parse (/var/www/site/node_modules/@vue/component-compiler-utils/dist/parse.js:14:23)
    at Object.module.exports (/var/www/site/node_modules/vue-loader/lib/index.js:67:22)
 @ ./resources/assets/js/app.js 60:29-81
 @ multi ./resources/assets/js/app.js ./resources/assets/sass/app.scss

I've tried installing these warnings' dependencies as well but still get the same error above, I'm including these because it's what pops up when I run my bash script and run npm install from my staging branch:

npm WARN [email protected] requires a peer of eslint@^5.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of eslint@^5.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules/webpack-dev-server/node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})

package.json dependencies

"devDependencies": {
    "axios": "^0.19.0",
    "babel-preset-stage-2": "^6.24.1",
    "browser-sync": "^2.26.7",
    "browser-sync-webpack-plugin": "^2.2.2",
    "cross-env": "^5.2.0",
    "eslint": "^6.1.0",
    "eslint-config-standard": "^13.0.1",
    "eslint-loader": "^2.2.1",
    "eslint-plugin-import": "^2.18.2",
    "eslint-plugin-node": "^9.1.0",
    "eslint-plugin-promise": "^4.2.1",
    "eslint-plugin-standard": "^4.0.0",
    "eslint-plugin-vue": "^5.2.3",
    "exports-loader": "^0.6.4",
    "imports-loader": "^0.7.1",
    "jquery": "^3.3.1",
    "laravel-mix": "^4.1.2",
    "lodash": "^4.17.11",
    "resolve-url-loader": "^3.1.0",
    "sass": "^1.22.10",
    "vue": "^2.6.10"
  },
   "dependencies": {
    "@vue/component-compiler-utils": "^3.1.1",
    "ajv": "^6.10.0",
    "babel-polyfill": "^6.26.0",
    "bootstrap": "^4.3.1",
    "braces": "^2.3.1",
    "es6-promise": "^4.2.6",
    "font-awesome": "^4.7.0",
    "luxon": "^1.12.1",
    "moment": "^2.24.0",
    "popper": "^1.0.1",
    "popper.js": "^1.14.7",
    "sass-loader": "^7.1.0",
    "vue-datetime": "^1.0.0-beta.10",
    "vue-datetime-picker": "^0.2.1",
    "vue-full-calendar": "^2.7.0",
    "vue-loader": "^15.8.3",
    "vue-router": "^3.0.2",
    "vue-template-compiler": "2.6.10",
    "vue-wysiwyg": "^1.7.2",
    "vuex": "^3.1.0",
    "weekstart": "^1.0.0",
    "whatwg-fetch": "^2.0.4",
    "wkhtmltopdf": "^0.3.4"
  }
}

I think it might have something to do with a specific version of a dependency. But nothing I've been trying from other stack overflow threads or Google searches has been helping

Let me know if there's any code missing that may help

9
  • Can you show the code with using 'parseComponent'? Commented Jan 22, 2020 at 20:12
  • Is this your component ./resources/assets/js/components/component.vue or system? Commented Jan 22, 2020 at 20:15
  • the component is the first one, and the thing using parseComponent is the dependency I believe, I don't have parseComponent in any of my components Commented Jan 22, 2020 at 20:16
  • Have you checked this issue github.com/eddyerburgh/parcel-vuejs-template/issues/11 ? Commented Jan 22, 2020 at 20:16
  • @webprogrammer yes I tried rolling that dependency back to that suggested version but i still get the same error Commented Jan 22, 2020 at 20:20

7 Answers 7

53

I had exacly the same problem and just figured it out, I hope this helps someone. First I changed the vue template compiler to:

"vue-template-compiler": "2.6.11"

and the I also had to change the vue version to the latest realese, in my case:

"vue": "2.6.11"

Sign up to request clarification or add additional context in comments.

1 Comment

Can confirm the issue for me was with old versions of vue-loader and vue-template-compiler
18

Try running this command

npm update vue-template-compiler

2 Comments

did not wirk with me :-(
Sorry to hear that.
18

Try this:

npm remove vue-template-compiler

npm remove vue

then

npm install [email protected]

npm install [email protected]

This will match the version of vue and vue-template compiler on your project.

Comments

12

The version of "vue-template-compiler" should match the version of "vue". If the dependency is declared as:

"vue": "^2.6.11"

Npm will possibly install [email protected], which is mismatched with the version of "vue-template-compiler". As of what updates between 2.6.11 and 2.6.12, you can refer to the release notes.

Comments

5

I had the same issue and I ran the command: npm update vue-template-compiler. All solved.

Comments

2

For yarn:

yarn remove vue vue-template-compiler
yarn add vue vue-template-compiler

yarn upgrade seemed to have errors.

Comments

0

If your project worked before, but then a subsequent install caused errors, another thing you can try instead of upgrading vue-template-compiler is to pin the vue build dependency versions in your package.json by using exact version numbers in dependencies or devDependencies, and in overrides to force sub-dependencies to their minimum specific versions where they were surely known to work.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.