108,138 questions
1
vote
0
answers
81
views
ESLint configs error Parsing error: Invalid ecmaVersion
I'm writing a shared ESLint configuration for my own project.
One of the configurations for the JS project is:
import js from '@eslint/js';
import { defineConfig } from 'eslint/config';
import ...
0
votes
1
answer
41
views
Is it possible to use vuetify theme color in component css? [closed]
I have a custom theme color I would like to use in my CSS. I want to change the text and icon color in an element based on whether the mouse is hovering over it and couldn't get v-hover to work ...
0
votes
0
answers
49
views
Vue SSR - computed gets executed only once?
I have a page roughly layouted like this: (simplified to showcase the problem)
// PageContent.vue
<script setup>
const props = defineProps({ data: Object });
const chapters = ref(null);
function ...
0
votes
1
answer
195
views
In a PrimeVue DataTable with rowGroupMode set to rowspan, is it possible to groupRowsBy multiple 'columns'?
Is it possible at all to set up a DataTable in PrimeVue where rowGroupMode is set to rowspan and groupRowsBy is done on multiple columns? For example:
Time and User always span the same number of ...
0
votes
1
answer
41
views
What are the possible outcomes of the event value from update:modelValue of a Vuetify Datepicker?
So having a look at the documentation we see that when a Vuetify Datepicker component raises the update:modelValue event it passes a value of type [unknown].
My own component is working with Date | ...
0
votes
1
answer
51
views
Tailwind 3 not recognizing width/height rules when elements are loaded dynamically
I have a Vue 3 application using Tailwind 3. If I have an element directly on the page, the sizing rules are applied without issues. Here's a vue file to illustrate:
<div class="w-48 h-[...
0
votes
1
answer
70
views
Computed list with arrow function inside object not working [closed]
I am using Vue 3.5.13 and I have this computed list:
const entries = computed<Entry[]>(() => {
const elements = model.value.elements;
return elements.map((element, index) => {
...
-2
votes
1
answer
73
views
Replace leading minus with trailing BCE
I'm not able to use the date module in my CMS because of the historic dates (many are before the common era), I want to use numbers (this provides me with a correct sorting of the items); so when I ...
4
votes
0
answers
235
views
Uncaught SyntaxError: Identifier 'validate' has already been declared in .nuxt/middleware.mjs
I'm working on a Nuxt 4 project and sometimes, after I update a file, J got the following error in the browser console:
Uncaught (in promise) SyntaxError: Identifier 'validate' has already been ...
0
votes
0
answers
33
views
Vue 3 Suspense does not have @resolve fallthrough
I'm trying to wrap the Suspense component and have the resolve event handler fallthrough.
Demo
App.vue:
<script setup>
import SuspenseCustom from './components/SuspenseCustom.vue';
import ...
0
votes
2
answers
51
views
How to copy values from an object to another limiting to properties of another object in vue.js/TypeScript?
In a TypeScript-based vue.js 3 app, some values are provided as part of the initialization. Those values are automatically set to the props variable by vue.js. As those values can be updated by an ...
0
votes
0
answers
102
views
How do I consume a third-party web component in a Nuxt app?
Is there a tutorial about how to use Web Components in a Nuxt app? I am trying to include one in my app.
First, I created a Vue app and figured out how to use it there and I got it working perfectly.
...
1
vote
0
answers
45
views
Avoid duplicated base URL when serving Vue SPA index.html locally and assets from CDN via Nginx
I’m hosting a Vue.js single-page application using history mode routing. The app’s static assets (JavaScript, CSS, images) are stored on DigitalOcean Spaces CDN, with the Vue app’s publicPath ...
0
votes
0
answers
35
views
Navigating to an anchor in Vue SPA not working in Safari
I have a page rendered using Vue, as part of an SPA app. In that page there is a header with an id element, but if I try to navigate to it, either as direct URL or a link in the page then no ...
1
vote
1
answer
43
views
Render extra item in VueJS v-for
I have standard v-for like so (using BootstrapVue):
<b-col v-for="(card, index) in cards"
:key="index"
cols="4">
<b-button> Click Me! &...
0
votes
2
answers
89
views
Dynamically adding/modifying an HTML element with other elements/attributes
I am not sure if this is possible or not but I am receiving an element from the backend and I am trying to modify it to convert a word to a link. This is all in Vue3/Typescript.
Example of backend ...
1
vote
4
answers
165
views
How to access raw text content of slot?
I am trying to access the raw content of the default slot in Vue.js (3.5). However all I seem to be able to access, no matter what method I try, is the content all compressed into a single line.
I ...
1
vote
1
answer
50
views
404 error has been returned after "connect-history-api-fallback" middleware handed request
Need to provide the HTML5 mode for Vue frontend and Express backend.
Client:
import { createApp as createVueApplication } from "vue";
import {
createRouter,
createWebHistory,
type ...
1
vote
1
answer
60
views
VueJs emit event to parent template
I have a page that inherits from a base template (GuestLayout)
GuestLayout
<script>
import Toast from '../Components/Toast.vue'
export default {
components: {
Toast
},
data()...
0
votes
2
answers
58
views
How to change Tree folder icon in Ant Vue Design with another SVG?
Have some SVG icons and I want to change the icons with default (Ant Vue Design Tree) Icons.
This is my code I am using tailwind and TypeScript, Vue.js and this is a component that will show in App....
0
votes
0
answers
36
views
Reactivity issue with TRichSelect, it works but not when called by an internal function [duplicate]
I am using Vue 2 in my application, and the TRichSelect component from the VueTailwind library is not reactive when I populate the v-model variable through an internal function. It works correctly ...
0
votes
0
answers
55
views
How to properly configure Vite + Vue 3 for webOS (>= 6.0) to support both modern and legacy chunks (including Web Workers)?
I'm building a Vue 3 application using Vite and targeting LG webOS Smart TVs (version 6.0 and higher, tested on webOS 22). I want to support both modern browsers (via ES modules) and older engines by ...
0
votes
1
answer
34
views
Using properties in router-link to field
I have a list of items each with a name and numerical ID. Each one I want to render as a component with a link to a page for that item. This requires me to have a <router-link> tag. I cannot ...
0
votes
0
answers
35
views
Vercel & GitHub Pages Deployment Images Issue
I've built a website with Vue (a Vue/Vite project), and while I was developing, I encountered no issues with how the images were displayed.
However, upon deployment to both Vercel and Github Pages, ...
0
votes
3
answers
118
views
Minifiying javascript file with webpack breaks vue functionality (specifically with method calls on class instance)
I am working on an ASP.NET project that uses Vue.js and jQuery. I have a JavaScript file (fields.js) that defines several classes (e.g., Users, Fields) and initializes a Vue instance. When I use the ...
1
vote
1
answer
130
views
Use of iconify/tailwind4 plugin with vue dynamic class names
I'm using
@plugin "@iconify/tailwind4";
in my Vue.js project. This works fine using "static" class names like:
<span
:class="`icon-[tabler--carrot]`"
class="...
0
votes
1
answer
92
views
Unable to open Vue Devtools from Toggle or Select Components in Firefox/Chrome on macOS
Environment:
OS: macOS (e.g., Sonoma or Ventura)
Browsers tested: Firefox (latest), Chrome (latest)
Vue Devtools version: [7.7.7]
Vue version: [e.g., Vue 3.4.21]
Devtools installation method: Browser ...
0
votes
1
answer
55
views
Why does inject() return the value of a ref from a reactive object instead of a reactive reference?
I'm working with Vue 3's Composition API, and I’m trying to provide a ref that is part of a reactive object. However, when I inject it in a child component, I get the raw value, not the reactive ref.
...
0
votes
0
answers
108
views
How i can integrate Zoom call API in Laravel for users
i want to integrate Zoom call API so users can talk with each other but i don't want to create host my self so if user created the call the user should be the host
public function createMeeting($data)
...
0
votes
0
answers
66
views
How to keep buttons always at the bottom of the Ion Sheet Modal?
I am using ion modal with breakpoints so it has handle and I can resize it.
Good State #1
Good State #2
Here in this picture you can see the correct thing:
And also when I click submit it is correct ...
0
votes
0
answers
37
views
CropperJS crop() is never called in Vue component, preview not updating
I'm trying to build an image cropper in Vue using CropperJS. The cropper UI appears as expected, and the image loads and displays correctly.
The issue I'm running into is that the preview isn't ...
0
votes
1
answer
315
views
How to modify the matching mode of the filters in a PrimeVue TreeTable?
I am using the TreeTable component of the PrimeVue library.
In the example from the documentation (https://primevue.org/treetable/#filter ) the filters are initialized with:
const filters = ref({});
...
0
votes
1
answer
56
views
How to intercept a form submit in websocket connection?
I have "inherited" a piece of code from a chat application. I would like to add some custom checks on the user input upon submission, allowing the submit to be aborted on client side if ...
0
votes
1
answer
51
views
Firebase SignInWithRedirect with Apple login fails on a nuxtjs / js app
I believe a Nuxt.js (Vue.js) web app with Firebase is correctly set up, as I'm able to log in with Firebase/Apple using signInWithPopup.
I have properly set my custom domain in the Auth domain ...
0
votes
0
answers
71
views
Cant read `useStorage` data on the client-side
I have a Nuxt 3 app where I use useStorage to persist some json data.
Right now I have a Nitro plugin that runs on startup and loads the data from an external API, like this:
import { ...
0
votes
3
answers
119
views
NPM package - difference in running npx command vs npm command
I have bootstrapped a NPM package using npm create vite@latest and am having trouble with getting it to generate the index.d.ts file.
In my package.json I have my build script as vue-tsc -p tsconfig....
0
votes
2
answers
78
views
How to fix "Search functionality must be placed within a landmark region" WCAG issue with input and icon?
I'm trying to fix a WCAG accessibility issue flagged by tools like axe/lighthouse:
Search functionality must be placed within a landmark region
input.v-input
The input is wrapped in a div with role=&...
0
votes
3
answers
51
views
Vue's slot with dynamic component
in Vue, I would like to fill a slot with a dynamic component, but this does not seem to work.
I have the following BaseIcon element
<template>
<svg>
<g>
<slot />
...
-1
votes
1
answer
107
views
My fpdf2 PDF is blank when I try to download it from the browser after passing it to the front end
I cannot for the life of me figure out why this PDF won't display. I'm using fpdf2 to create a PDF that looks good when saving it from the Python script. However, something must be going wrong when ...
0
votes
1
answer
160
views
Cropper.js image is too small in Vue 3 component
I'm new to Vue and Cropper.js, and I'm working on a project where I let users upload and crop their avatar.
The problem is that the image inside the cropper appears extremely small (sometimes like ...
0
votes
1
answer
181
views
Element Plus issue after migration from vue 2 to vue 3
I'm encountering issue with Element UI after migrating from vue 2 to vue 3
the clearable attribute doesn't work anymore for el tags like el-select, el-input.
<el-input v-model="searchForm....
0
votes
0
answers
89
views
Nuxt Umami not sending network requests in production (but works locally)
I'm using nuxt-umami in a Nuxt 3 app. It works perfectly on localhost — I see network requests to /api/send. But on production, no requests are made, and I see this error in the console:
[UMAMI]: Your ...
2
votes
1
answer
54
views
How to use data from export component in class?
I got a class, that was defined in the same Component File, but out of scope for the data, that i am exporting. I'd like to simply call the function, that was defined inside the "export default&...
0
votes
0
answers
175
views
How to check if form is valid with Valibot?
I’m using Valibot for schema validation in my Vue3/Nuxt3 app.
I currently validate my form like this:
function validateForm() {
try {
const result = v.parse(schema, { title, description, ...
0
votes
0
answers
68
views
Vite/Nuxt 3 dev server: "eventemitter3 doesn't provide an export named 'EventEmitter'" but works in production build
i'm building a Nuxt 3 (Vue 3) app using Vite as the dev server. My app uses dependencies like @solana/web3.js and socket.io-client, which internally depend on eventemitter3.
when I run the dev server (...
0
votes
1
answer
60
views
Change tooltip type when moving between grids in chart
I have a graph with multiple y-axes/x-axes, and currently, ECharts does not allow for different tooltip types between grids. I have three y-axes/grids within one graph, and for the first two, I would ...
0
votes
0
answers
56
views
Configuration of EmailJS works in localhost but not in production
I am developing a project with Vue.js, so to manage sending email through the contact form instead of the backend, I am using Email.js. I followed steps as below:
Add an email services
Create an ...
0
votes
1
answer
122
views
VS Code not recognizing .vue files — “Code language not supported or defined” despite Volar installed
I'm working on a Vue 3 project using Visual Studio Code on Windows 11.
Even though I have installed the Vue - Official extension (from Vue) and tried reinstalling it, VS Code keeps showing this error ...
0
votes
1
answer
173
views
Nuxt 3/Nuxt UI UNavigationMenu won’t highlight hash‐based section on page reload
I’m using the Nuxt UI <UNavigationMenu> component in my Nuxt 3 app to render a header nav that scrolls to sections via hash links within my pages/index.vue (#about, #products, #news, etc.). ...
2
votes
0
answers
152
views
How do I set up .NET Aspire to use Microsoft Entra for a VUE app?
Currently my Aspire AppHost looks like this
var cache = builder.AddRedis("cache");
// Add Key Vault access
var keyVaultUri = builder.Configuration["KeyVault:Uri"];
if (string....