Skip to content

vue 3 + ts + router - new project - Component not loading.. inconsistent hot reload, throwing error when making changes to Home component #5863

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
pranay-91 opened this issue Sep 9, 2020 · 5 comments · Fixed by vuejs/core#2088 or #5868

Comments

@pranay-91
Copy link

Version

4.5.4

Environment info

mac os: 10.15.4
node: 14.5.0

Steps to reproduce

  • create a new project
  • npm run serve
  • initially threw error to enable plugins form decorators and decorators-legacy in babel
  • second time np run serve, successfully compiles
  • HelloWorld Component is missing.
  • developer console throwing warning: Failed to resolve component.
  • making changes to Home Component throws same decorators error.

What is expected?

build successfully
load components succesfully

What is actually happening?

build is sometime successful sometime fails
some components are not loading


  • could be issue with Decorators?
  • could be issue with Router Component?

warning in dev console

runtime-core.esm-bundler.js?5c40:38 [Vue warn]: Failed to resolve component: HelloWorld
at <Home onVnodeUnmounted=fn ref=Ref< undefined > >
at
at
warn @ runtime-core.esm-bundler.js?5c40:38

warning when compile fails

ERROR Failed to compile with 1 errors 8:28:12 pm

error in ./src/views/Home.vue

Module Error (from ./node_modules/vue-loader-v16/dist/index.js):
This experimental syntax requires enabling one of the following parser plugin(s): 'decorators-legacy, decorators' (7:0)

@ ./src/router/index.ts 3:0-37 7:13-17
@ ./src/main.ts
@ multi (webpack)-dev-server/client?http://192.168.0.149:8080&sockPath=/sockjs-node (webpack)/hot/dev-server.js ./src/main.ts

@pranay-91
Copy link
Author

It seems to be the issue with Decorators. Using without Decorators , defineComponent is working fine.
Other candidates arevue-class-component or the vue-router?

@haoqunjiang
Copy link
Member

It's caused by the recent releases of vue-loader. I'm looking into it.

@emiyalee1005
Copy link

Having the same problem here

@shijunti19
Copy link

me too

@zhoulhcn
Copy link

+1

haoqunjiang added a commit to haoqunjiang/vue-cli that referenced this issue Sep 10, 2020
These are enabled by default in the `@vue/babel-preset-app`.

Fixes vuejs#5863
Fixes vuejs#5866

These doesn't fix the case where user has enabled more custom syntax in
babel. `@vue/compiler-sfc` needs to fail gracefully in such cases.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment