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.
1,416
questions
2
votes
1
answer
17
views
Why do we need nuxt when we have Vite?
I'm learning vue, and it' ecosystem, and now I read about nuxt.js. And as I understand, this is tool which help us to build vue apps, but don't we do the same with vite.js? What's the difference ...
0
votes
0
answers
9
views
Laravel Vite Deployment to Host
I'm having a trouble with Vite in Laravel. I ran the command npm run build and then I uploaded files to my shared hosting. But it doesn't load css and js files. It gives me these errors in console:
...
0
votes
0
answers
24
views
Is there a way to integrate UI Element component with Laravel Inertia.js?
I am trying to integrate the UI Element component by using NPM, but the new version of Laravel uses Vite instead of Mix, and that is incompatible. Is there any help in adding UI Element to Laravel ...
0
votes
0
answers
10
views
how to move index-html file in a react app bundled via vite to the public directory
when i create reactJs vite app using the script npm init vite app-name the index.html file is located in the src file,and is putting the index.html file in src folder a healthy practice? if not how to ...
1
vote
0
answers
20
views
Build Vite app in GitHub Pages routes system
I'm building a website with solidjs and vite, and I'm planning to deploy it to GitHub-Pages which has the routes and files based on the repository, so if I want a route in /about/ I have to create a ...
0
votes
0
answers
16
views
vite rebuilds dev server on every http request, causing graphql schema duplicates instantly crashing server -- build and production works, repo inside
I'm trying to build a graphql server using nestjs and using vite + swc as the compiler/builder for performance reasons, webpack would take 50-60+ seconds on each rebuild on a big project, SWC/vite ...
0
votes
1
answer
19
views
Installing font-awesome with Laravel 9 (Vite)
i'm using Laravel 9 which doesn't use mix anymore, but vite, to bundle resources, i'm also not using any preprocessors like sass or less and don't really know anything about them.
Every text about ...
0
votes
0
answers
13
views
vite compilation: Expected "meta" but found "meta$1"
I'm getting error during building nuxt 3 project. During developing there is no error, but when I run build, then I get an error "ERROR: Expected "meta" but found "meta$1", ...
-1
votes
0
answers
18
views
Vite says after npm run dev: The service is no longer running
I have been on this issue for days now, please. I need help. I create a new vite project, ran npm install and npm run dev and I keep getting this weird error that the service is no longer running ([...
0
votes
0
answers
19
views
NestJS + Vite + Graphql, playground loads once but then immediately throws "Schema must contain uniquely named type" reproducible git repo inside
I've been trying to get this combination working for a while and fiddled with versions & compatibilities issue until I've hit this brick wall.
The app works in production once you build it -- it ...
0
votes
0
answers
11
views
Vite & Typescript: Yarn workspace commands running out of memory
I've set up yarn workspaces according to their documentation and added a couple packages. I'm now running into what looks like some kind of memory leak when building and running tests. I'm using ...
0
votes
1
answer
14
views
How to fix production 404 error on images' imports
I have a few images on a site that doesn't get loaded. I'm using Vercel and Vite's production preview and both give me this error when importing images:
Failed to load resource: the server responded ...
0
votes
0
answers
19
views
Error in Vite Preview: Uncaught (in promise) SyntaxError: JSON.parse: unexpected character at line 1 column 1 of the JSON data
I'm facing this Uncaught (in promise) SyntaxError: JSON.parse: unexpected character at line 1 column 1 of the JSON data error when using vite preview after vite build.
My vite.config.js:
import { ...
-1
votes
0
answers
15
views
Tailwind css classes not working with laravel 9 sail + vite, no utility classes were detected in source files
I have a problem with my application development. There are no utility classes loaded in from the tailwind cli, and I don't know why. It is probably in the config files, but I have not found the ...
1
vote
0
answers
26
views
Vite + Cypress 10: how to work with `import.meta.env`
Vite + Cypress: How to get them to work together?
Swapping from Vue-cli to Vite included a change from using process.env to import.meta.env for all env variables - this is quite a problem because ...
0
votes
0
answers
13
views
React component is imported as an object in test environments
I am writing a React application using Vite and Typescript, with automated tests using Vitest. One of my components uses react-viewer, and looks something like this
import Viewer from "react-...
0
votes
0
answers
19
views
Avoid bundled files to be named index
I’m using vite with React 17 and use code splitting through the use of import(). I also use React’s lazy function to lazy-load my routes.
This gives something like that in my App.jsx main file (note ...
0
votes
1
answer
12
views
Transforming const to the configured target environment ("es5") is not supported yet when using vite
this is my tsconfig for a react project built without car
{
"compilerOptions": {
"target": "es5",
"outDir": "lib",
"lib": [&...
0
votes
0
answers
11
views
Vue: CMS API call to generate an array of content components (defineAsyncComponent) - Error Catching
GOAL: get API call from a headless CMS that returns a JSON with an array of content components with their settings and content
now, the CMS does not know if the components are available
neither does ...
0
votes
1
answer
16
views
Netlify: Page not found except index.html
I deployed site on Netlify, then it shows only index.html, when i clicking links which goes to other pages in my website it shows "Page not found",
I used vite to run and build my project, ...
0
votes
0
answers
18
views
vue 3 class-based-component to Nuxt 3 Migration
Right now we are trying to migrate a Vue 3 Project to Nuxt 3. The biggest problem seems to be with Vite not playing well with vue-property-decorator and vue-class-component.
Here is the Stacktrace:
...
0
votes
1
answer
28
views
Vite Hot Reload and Laravel Homestead
I have a fresh Laravel 9 installation with Vite.
I use Laravel Homestead as a development environment (on top of a Windows 10 OS).
However, I cannot manage to make them work together: once I run npm ...
0
votes
0
answers
15
views
Error jquery, when we use vue3-select2-component in laravel9, vue3
Using vue3-select2-component in vue3 and laravel9 displays this error:
Uncaught (in promise) SyntaxError: The requested module '/node_modules/jquery/dist/jquery.js?v=095d0e0d' does not provide an ...
0
votes
0
answers
27
views
can't open project routes after 'npm run dev' in laravel vite with laradock
I have installed Laravel with Laradock, and Breeze with Vue ( which has Inertia in it ).
Now I run the project with docker-compose exec workspace bash and npm run dev
The only page that I see in every ...
1
vote
0
answers
20
views
When I run vite preview I get the bundle size of 300KB and when I run vite build it creates a bundle with 900KB
I am using Vite in a react project.
Versions -
"react": "^18.2.0",
"react-dom": "^18.2.0",
"vite": "^3.0.0",
"@vitejs/plugin-react"...
1
vote
0
answers
29
views
npm create vite@latest throws 'create-vite' is not recognized as an internal or external command error
this is the error i get for last 2 days.
even tried another solutions like re-installing node and npm, changing PATH in environment variables.
but nothing works. i moved to pnpm now, there vite works ...
0
votes
0
answers
16
views
published vite vue 3 npm package have problem with styles
I have published very simple toast component package in npm , here with vite , vue 3 and typescript .
you can see Repo here .
there are two problems .
first problem is that when you install this ...
0
votes
1
answer
30
views
Does the command vite start have some advantages over node ./index.js
I'm launching a new SvelteKit app for production and came across the vite start command.
I'm always starting the app with node file.js.
Does the vite command have extra advantages over basic node?
I'm ...
0
votes
0
answers
12
views
popup.html file not included inside chrome extension build using vite
I'm using this github cli plugin to scaffold mv3 chrome extensions using vue and vite.
The template is created correctly and I'm able to work on it, but I have a problem when I want to use the chrome....
0
votes
1
answer
34
views
Vite build failed on cloudflare pages
I'm trying to deploy my vite+react application on cloudflare pages, and it shows
(node:1365) ExperimentalWarning: The ESM module loader is experimental.
file:///opt/buildhome/repo/node_modules/vite/...
0
votes
0
answers
15
views
proxy api is not working in Vite + Vue 3 project when it's deployed to Vercel
I have an issue with Vite+Vue3 project.
I used Vite proxy to fetch data via api and it's working well in local.
But 404 error is caused when it's deployed to Vercel.com.
Vite configuration is like ...
0
votes
1
answer
26
views
How to reference modelValue from a function in a VUE componenet
I am using Vite to build my Vue SFCs. I need to access the modelValue inside a function declared by the component. How do I do it?
Here is what I tried:
<script setup>
defineProps([ 'modelValue' ...
0
votes
0
answers
22
views
how to validate fields with nested objects in vue 3 with composition api
I use vue , vite and typescript , I guess that this question has been posted already maybe , but i don't know there aren't so examples with composition API and typescript , I have this structure :
...
0
votes
0
answers
12
views
Parsing error : [BABEL] D:\..\.\..\{filename}.jsx : Cannot find module '@babel/plugin-transform-react-jsx'
Require stack:
D:\.\..\.\..\node_modules\@babel\core\lib\config\files\plugins.js
D:\.\..\.\..\node_modules\@babel\core\lib\config\files\index.js
D:\..\.\..\node_modules\@babel\core\lib\index.js
D:\..\....
0
votes
0
answers
11
views
How to reduce the number chunks using Vite?
Vite produces unreasonably small chunks (90% of all chunks are under 1KB with a few 300KB+).
Here is the full build log:
https://gist.github.com/gajus/0149233592085181331dde7076fc50b1
This is example ...
0
votes
1
answer
26
views
How do I remove a HTML tag from a string I query from an API?
I am querying an API that returns
image
<p> text.. </p>. <b> title</b>
The problem is that the string has a html tag, I want to know how can I remove this tag or failing that ...
1
vote
0
answers
13
views
Removing the aside in vitepress
Feeling really silly right now, but for whatever reason I cannot get this aside to go away in my vitepress docs.
The docs say that I just need to add aside: false and it should be gone, but mine is ...
1
vote
1
answer
60
views
laravel 9 + Vue.js 2 And Vite im facing error
I'm new in laravel 9 and vite my old project im using laravel 7 with laravel/UI vue.js 2 for my project now im using laravel 9 and vue.js 2 and vite for my project im developed as my old style in used ...
0
votes
1
answer
36
views
Firebase App Check returned error status 500 in production (Web App)
I add Firebase App Check with reCAPTCHA Enterprise in my vue3 project(web app project), and work well on mode devel(debug provider). But when build on production, appcheck not working and return HTTP ...
0
votes
0
answers
31
views
error to generate build: [vite:load-fallback] Could not load
The problem seems to be that I set baseUrl in TypeScript and paths(alias).
config of typeScript
"baseUrl": ".",
"paths": {
"screens/*": ["./src/...
0
votes
0
answers
26
views
Fixing Modals in Flowbite-Svelte, Basic example not working
I’m trying to get Svelte, Flowbite and TypeScript working together. I was specifically testing the ability to handle modal dialog boxes. I found in my first round of testing that I could bring modals ...
0
votes
0
answers
20
views
Nested Laravel-inertia-react App using nginx+phpfpm
I'm currently building a server running multiple laravel apps with inertia-vite-react stack, the file structure is like this:
/var/www/app1
/var/www/app2
this is my nginx config:
location /app1 {
...
0
votes
0
answers
31
views
Svelte - Sveltestrap - Bootswatch - SASS variables
I am evaluating Svelte with Bootstrap/Sveltestrap and a Bootswatch theme.
I need to support an offline use case, which means Bootswatch's fonts can't be loaded from google via a CDN.
So i configured ...
0
votes
0
answers
18
views
How to correctly use font awesome with laravel-vue, tailwind and vite?
I was successfully using font-awesome in a laravel-vue project with laravel-mix and after migrating from laravel-mix to vite, there was no noticeable issue with icons. Fast-forward to a few weeks ...
0
votes
0
answers
31
views
+150
How to debug Vitest test in the browser?
I already failed in webstorm: https://youtrack.jetbrains.com/issue/WEB-56836/Vitest-debugging
So what else should I add to debug tests in the browser? I tried node --inspect ./node_modules/vitest/...
1
vote
0
answers
26
views
Is there any possible way to programmatically load all images from a local workspace directory to a vite-react component?
I am trying to figure out a way for me to add some jpgs to my cats gallery. My layout includes images from one of three categories. I am using vite-react scaffold. I thought I could find a way to ...
1
vote
1
answer
20
views
How to specify what will be the export build js and css filenames in svelte
I am using vite for svelte, I have attached vite.config.js below, I tried looking for references on the web but couldn't find any
import { defineConfig } from 'vite'
import { svelte } from '@sveltejs/...
0
votes
0
answers
15
views
Production response status 500 for Sveltekit Endpoints with Vite served on Netlify
Similar to this issue SvelteKit with Nginx returns response error 500 but I am using Sveltekit's post Vite 3 update, Contentfuls JS API and the Sveltekit Netlify Adapter and do not wish to prerender ...
1
vote
0
answers
14
views
how to return a devserver for custom configuration while setting up cypress component testing with custom devserver
I have a react component library which is bundled using Rollup. I want to add cypress component testing so that I can unit test those components using cypress.Cypress currently supports setting ...
0
votes
0
answers
31
views
Npm package Vue3 UI library don't run in Nuxt
I have a UI library with Vue3 Composition API components. It works fine in other Vue projects but there is a problem in Nuxt 2.6 project.
My library has component Badge
// components/badge.vue
<...