Questions tagged [vite]
For questions about using Vite, a two-part build tool (dev server + build command) that aims to provide a faster and leaner development experience for modern web projects.
6,656
questions
-3
votes
0
answers
13
views
React App 18 + Vite 5 + React Router Displaying White Screen of Death [closed]
everyone. I am building a progressive web app with React 18 which I scaffolded out with Vite 5. I am handling routing and linking using React Router. It worked fine in the beginning until recently, ...
0
votes
0
answers
10
views
Configuring nginx to work with separately containerized frontend and backend
The problem is that I have a separately containerized frontend and backend for my full stack web app (vue3, node, express, vite, axios). When running locally without a container, I can connect the ...
0
votes
0
answers
4
views
Exposing Global Variable In Vite
After hours of searching through the doc (Vite) I've realised there is no simple way to expose a global string variable accessible via window.MY_VARIABLE in the browser console. At least as I can see ...
- 318
0
votes
1
answer
8
views
Nuxt 3 HMR Module not reloading changes
I have nuxt 3 project and installed couple of packages .
the hmr was working fine .. it just stopped suddenly no clue why .
there's no errors in the console . the cmd shows the files are being updated ...
- 1
0
votes
0
answers
6
views
Web component library using Lit return Failed to resolve module specifier "lit"
I created a new web component library project based on :
[email protected]
[email protected]
using Vite's library mode (see https://dev.to/receter/how-to-create-a-react-component-library-using-vites-library-mode-...
- 1,454
0
votes
0
answers
14
views
How do I serve a React.js Vite app hosted on an Azure container instance over a custom route, where routing is managed by Caddy?
I want to serve my React app from a different route, so that I can keep all of my servers on the same container group.
My Caddyfile looks like this:
fqdn {
handle_path /backend* {
...
- 13
0
votes
0
answers
7
views
Codespaces Preview url doubled
I run a vue app in codespaces and when I start the preview server through vite the url in the browser bar is doubled:
https://blabla-pxjcg97-3000.app.github.dev/https://blabla-pxjcg97.github.dev/
...
- 2,334
1
vote
1
answer
23
views
Vite generate typings for shared packages in monorepo
I am restructuring a repo to a monorepo and creating some shared packages i.e. components, theming, test-utils etc.
The repo was already using Vite so I have kept this and have introduced turborepo as ...
0
votes
1
answer
14
views
Cannot Import local module/file in Electron-vite (vue)
index.js(entry point of electron)
import { connect } from "./MongoDB";
MongoDB.js
module.exports = {
connect,}
error-
> electron-vite dev
vite v5.3.4 building SSR bundle for ...
- 1
0
votes
0
answers
9
views
Empty page with 404 errors when deploying Vite + Vue app to gh-pages, despite config files
I am in the process of creating a to-do list in Vue.js 3 to learn it and decided to deploy it to gh-pages as it is partially usable already. I am a complete beginner in Vue, I have previously worked ...
- 1
0
votes
0
answers
13
views
the shacdn/ui install command not intepret @ correctly to /src
i want to ask and i need help with this
i tried to follow the documentations of the latest shacn/ui using vite
but when i ran this command npx shadcn-ui@latest init
it seems not installing components ...
0
votes
0
answers
7
views
New Vite Project not installing node modules after "npm i"
I am in the process of creating a new react project with vite and whenever I run "npm i" inside the project the node modules and package lock are not created. I have vite and node installed ...
0
votes
0
answers
21
views
TypeError: e.map is not a function and also showing html code in browser console after deploying
Getting this html code:
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<link rel="icon" type="image/png" ...
- 41
0
votes
1
answer
18
views
web.config failed to rewrite index.html when a baseURL is added to sub directory in Vue 3 app with Vite
Currently working on a Vue 3 app which deployed using Azure web apps. When I deployed it to the root and used web.config it worked fine, But I need to add a Base URL. For that, I have added the ...
- 1
0
votes
1
answer
15
views
how to run vite on hostinger?
I recently uploaded my laravel project on hostinger.
Everything works fine apart from the vite.
How to configurate it to use npm and vite?
when I open the project I got this error:
Internal Server ...
- 9
0
votes
0
answers
14
views
how to get vite to compile scss/sass
I have a scss file i need compiled into a css file to be included on a blade template.
I have installed sass as a dependence.
I have the scss file listed in the scss additional data.
But during the ...
0
votes
0
answers
26
views
TailwindCss has different colors in Dist Build and run Dev
I need to help please, I have been building a project with tailwindCss and React, with Vite, but when I build my project then generate the dist carpet, but the colors are different when I run project ...
- 25
0
votes
0
answers
13
views
pathMapping in vs code debug is not working
I have the following as my launch.json file
{
"version": "0.2.0",
"configurations": [
{
"name":"Launch vite:dev",
"request&...
0
votes
0
answers
40
views
React: Expected “;” but found “:” with Vite and TypeScript
I’m encountering an error while using Vite with TypeScript and ESLint. The error message is as follows:
ERROR: Expected ";" but found ":"
[vite] Pre-transform error: Transform ...
- 199
0
votes
0
answers
19
views
How to configure Dockerized Laravel Setup for Vite?
My goal is to Dockerize Laravel + Vite + React.js with Inertia.js for Development. I can get the app to run, but it has no Hot Module Replacement (HMR) and loads the pages like SSR pages and not ...
- 57
0
votes
0
answers
22
views
How to Fix "Failed to Load Module Script" Error for React App Deployed on VPS with Nginx?
I'm a beginner trying to deploy my React application (static web pages) on a VPS using Nginx, and I'm running into a problem. After deploying, my app loads but doesn't display anything. The browser ...
0
votes
0
answers
42
views
Configure path alias with latest Vite project and React
I'm starting a project with React using latest Vite project template:
npm create vite@latest my-app -- --template react-ts
The template contains 3 tsconfig files.
tsconfig.json
{
"files": ...
- 83
0
votes
0
answers
9
views
How does a vite build product enable remote modules to use the same dependencies as local application modules?
I have an idea to use the same set of dependencies for remote components and the application's own components. The scenario is as follows:
I have a main application A developed via vite+react , A is ...
- 1
0
votes
0
answers
9
views
Why is my scss module file is removed after hmr in remix application after changing tsx file?
I'm new to remix and I'm trying to get css modules working, it looks like the css is removed from the html after a hot reload
I seem to have a pretty basic setup for my application and at the initial ...
- 1,783
-1
votes
0
answers
18
views
Accessing information from a redux store in the main app from a dynamically loaded React Module? [closed]
I am using React (18.2) built with Vite (5.0.0) using vite-plugin-federation (1.3.5) to split up my application into a main application and several modules which are dynamically loaded once a user ...
- 2,353
0
votes
1
answer
37
views
Getting 401 Unauthorized Error on Login in React Web App
Whenever I click the login button of my web page built with vite-react(frontend:5173), express(server 5000, to handle cookies httpOnly) and Django(backend:8080). the console logs an error of (GET http:...
0
votes
0
answers
12
views
NextJS 14 App Page Freezing UI using own custom developed NPM Packages in ReactJS using ViteJS
I have nextjs 14 app using mui, I have created my own npm packages for it's components in reactjs using vitejs, that is running perfectly fine.
Problem:
The issue I'm facing is that when i open ...
0
votes
0
answers
17
views
React vite build takes big size
I'm cereating a design system aka component library with react typescript and vite as build tool
I had an issue that whenever I Import any component it was importing all the package not only the ...
- 23
0
votes
0
answers
49
views
Deploying a MEVN stack app that uses 2 servers to Firebase [closed]
I want to know how I can deploy a MEVN stack app to Firebase. The problem is that I use two servers - one for the BE and one for the FE. In my package.json they are configured as follows:
"...
- 151
1
vote
0
answers
19
views
how to resolve localhost not secure problem with vite?
I'm working on a personal project developed with react + tailwind + vite. in my sign-up component, I need to POST some information from the client side ( localhost:5173 ) to the server side ( ...
- 39
0
votes
0
answers
10
views
undefined when use the env react with vite
i use react with vite and i want to use an env variable in my project. but i got undefined everytime i call the env variable. i have follow the documentation of vite and try a many solutions in ...
0
votes
1
answer
40
views
Vite React "use client" sourcemap warning
I have turborepo with React (Vite) and NextJS and shared components located in workspace. I have set it to use server components, but because of that Vite writes warning on build:
../../packages/ui/...
0
votes
0
answers
24
views
React Material UI VITE - Theme Problem - createTheme_default is not a function
in our React - Material UI Application for the frontend, we currently have the problem that sometimes when we switch the branch, we get the error: createTheme_default is not a function in the browser ...
- 1
0
votes
0
answers
11
views
Icons of Element UI do not appear
I'm using Element UI with an Electron - Vue 2.6 - Vite - SCSS app, and the icons (like ) do not appear. All the other Element UI components work just fine.
I have followed the instructions on https://...
- 11
1
vote
1
answer
30
views
React Vite deployed to Vercel But showing white page
Created a React Vite static page and it has deployed using vercel but when deployed it has white page
Repo:https://github.com/Aarif-Hussain-A-Nassar/Educa
Link:https://educa-gold.vercel.app/
Tried ...
0
votes
0
answers
19
views
how to actually implement a serverless function on Vercel for Vite code for production environment?
My code works perfectly fine using Vercel Dev, and a Postman request to the API route, but still, it says "Error: Error: Failed to fetch response."
I think the error may be a wrong fetch ...
0
votes
1
answer
38
views
How do I expose a library to the global window in Vitest?
So we are in the middle of adding Vitest to an existing project that currently relies on Webpack for bundling our code. We are in the process of rewriting older jQuery code into React.
Right now i'm ...
- 820
0
votes
0
answers
18
views
How to import react components from running vite dev into other web app
I want to write a component library in React and use it in a legacy app, but I want to be able to see code changes in the React code when I refresh the page.
Project A: A legacy web server that is ...
0
votes
0
answers
45
views
I'm getting an error while dockerizing a vite react app. RUN npm install in Dockerfile with npm ERR! code ERESOLVE
While trying to dockerize vite react app using "docker build . -t "cmsxeramed-frontend:v1.0"" i got the
following error in Docker Desktop:
FROM node:19.5.0-alpine
WORKDIR /app
COPY ...
- 11
0
votes
0
answers
27
views
Histoire not working with custom Vue component
I am trying to integrate Histoire in my Vue project (with Vite) and I successfully integrated it by creating a new component. But when I try to integrate it with an existing component of mine that ...
- 19
0
votes
0
answers
26
views
Docker compose env variables not working in Vue3 app
I built a QR Code generator and I want to dockerize it. The frontend of the app I built it with Vuetify, so it uses Vite and Vue3. Inside the frontend I have a .env file with the api url and the port ...
- 1
0
votes
0
answers
15
views
Set Vite host path to match Sail site URL
In my Laravel project I am outputting CSS/JS like so:
@vite('resources/sass/app.scss')
When I share the site with Laravel Sail, the built asset path becomes:
http://host.docker.internal/build/assets/...
- 818
0
votes
0
answers
18
views
Managing PowerShell Session Closure and Client Connections on Windows 10
I am running a Vite application on a Windows machine. However, when I try to close the PowerShell window, it doesn't release the port used by the application. Is there a way to send a Ctrl + C command ...
- 1,413
-1
votes
0
answers
50
views
Very verbose output from vite build
Does anyone recognise this output from vite build? I'm getting hundreds of lines like this and the build seems to have slowed considerably because of it. I'm pretty sure it's linked to my updating ...
- 28.4k
0
votes
1
answer
44
views
Import aliasing won't work in Vite (React, Typescript) boilerplate
I installed shadcn/ui into my vite boilerplate following the docs. But the compiler didn't seem to recognize the aliasing.
Note: typescript has more than one config file, namely: tsconfig.json, ...
- 47
0
votes
0
answers
15
views
TypeError: Cannot read properties of undefined (reading 'message') during Netlify Deployment
I'm facing an issue with deploying my React front-end code to Netlify. The application works perfectly on my local machine, but when I deploy it to Netlify, I encounter the following error:
enter ...
0
votes
0
answers
8
views
MERN frontend on public ip (117.162...:80) is not connecting to MERN backend on local ip (192.168.....:4000)
I have created MERN-VITE app and in local host it is working file even on my university network it is working fine and can be accessed from anywhere. But when I got public ip from IT department, the ...
1
vote
0
answers
51
views
"ESM integration proposal for Wasm" is not supported currently in Vite ReactJS and Typescript
I am using ReactJS, and Typescript with Vite and want to get the address from mnemonic I create a function for this generateAddressFromMnomic which takes a mnemonic string as a parameter but when I ...
- 127
0
votes
1
answer
32
views
How to implement 3rd party data fetches in Vite + Vue web-application?
I want to use 3rd party function (actually, it is mine, but written in different time and different file), which requests data via fetch function.
In my Vue + Vite application I import that function ...
0
votes
1
answer
39
views
Vite v5.3.2 building for production error
During the build, I experienced the following error.
> tsc && vite build
vite v5.3.2 building for production...
src/index.ts:1:20 - error TS6142: Module './components/Button/Button' ...
- 11