question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

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

See original GitHub issue

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<onVnodeUnmounted> ref=Ref< undefined > > at <RouterView> at <App> 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

Issue Analytics

  • State:closed
  • Created 3 years ago
  • Comments:5 (1 by maintainers)

github_iconTop GitHub Comments

2reactions
sodateacommented, Sep 9, 2020

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

0reactions
zhoulhcncommented, Sep 10, 2020

+1

Read more comments on GitHub >

github_iconTop Results From Across the Web

Vue cli 3 hot reload suddenly not working in browsers
Changes made to the code are still picked up by the terminal, however, my browser is not picking up the changes. I have...
Read more >
Why Your Vue Component Isn't Updating (and how to fix it)
1. Check that variables are reactive · 2. Make sure to update Arrays and Objects correctly (only in Vue 2) · 3. Use...
Read more >
Vue 3.1 - Official Migration Build from Vue 2 to 3 - This Dot Labs
We will be using this repository as an example for our Vue 3 migration. It is a Vue CLI application that implements a...
Read more >
React Suspense in Practice | CSS-Tricks
We'll look at how to integrate routing and data loading with Suspense ... React will look up the tree, find the first <Suspense>...
Read more >
Handling common JavaScript problems - MDN Web Docs
As with HTML and CSS, you can ensure better quality, less error-prone JavaScript code using a linter, which points out errors and can...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found