I might be doing something wrong but I can't make this tutorial working and I have no idea why: https://learn.microsoft.com/en-us/office/dev/add-ins/quickstarts/excel-quickstart-vue
When I run the addin in Excel I get these errors (Edge DevTools Preview):
HTML1300: Navigation occurred.
taskpane.html (1,1)
[HMR] Waiting for update signal from WDS...
SCRIPT5007: SCRIPT5007: Unable to get property 'config' of undefined or null reference
taskpane.html (18,1)
XML5632: Only one root element is allowed.
taskpane.html (1,1)
[WDS] Disconnected!
SCRIPT5022: SCRIPT5022: Office.js has not fully loaded. Your app must call "Office.onReady()" as part of it's loading sequence (or set the "Office.initialize" function). If your app has this functionality, try reloading this page.
office.js (46,28277)
taskpane.html content:
<!DOCTYPE html>
<html lang="">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="icon" href="/favicon.ico">
<title>my-xl-addin</title>
<script src="https://appsforoffice.microsoft.com/lib/1/hosted/office.js"></script>
<link href="/js/app.js" rel="preload" as="script"><link href="/js/chunk-vendors.js" rel="preload" as="script"></head>
<body>
<noscript>
<strong>We're sorry but my-xl-addin doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
</noscript>
<div id="app"></div>
<!-- built files will be auto injected -->
<script type="text/javascript" src="/js/chunk-vendors.js"></script><script type="text/javascript" src="/js/app.js"></script></body>
</html>
Update: After a bit more investigation, it appears that everything is working well by selecting Vue2 in place of Vue3. Now the question is more about migrating from Vue2 to Vue3 which is a different topic.
Update2: The quickstart got updated with a new src/main.js, everything is working well now
