Oops! We encountered an internal server error while trying to resolve the import for "@vue/server-renderer"

Several months ago, I created a Vue 3 project using Vite and everything was running smoothly. However, today when I tried to make a small modification, an error occurred at runtime. All Vue files are showing the same error message:

[vite] Internal server error: Failed to resolve import "@vue/server-renderer" from "src/App.vue". Does the file exist?
. Despite my global search, no file seems to reference vue/server-renderer. How can I resolve this issue?

[vite] Internal server error: Failed to resolve import "@vue/server-renderer" from "src\App.vue". Does the file exist?
  Plugin: vite:import-analysis
  File: PATH/vue3-element-admin/src/App.vue
  17 |  
  18 |  import { resolveComponent as _resolveComponent, withCtx as _withCtx, createVNode as _createVNode, mergeProps as _mergeProps } from "vue"  
  19 |  import { ssrRenderComponent as _ssrRenderComponent } from "@vue/server-renderer"
     |                                                             ^
  20 |  
  21 |  function _sfc_ssrRender(_ctx, _push, _parent, _attrs, $props, $setup, $data, $options) {
      at formatError (PATH\vue3-element-admin\node_modules\vite\dist\node\chunks\dep-0351185a.js:36769:46)
      at TransformContext.error (PATH\vue3-element-admin\node_modules\vite\dist\node\chunks\dep-0351185a.js:36765:19)
      at normalizeUrl (PATH\vue3-element-admin\node_modules\vite\dist\node\chunks\dep-0351185a.js:73694:26)
      at async TransformContext.transform (PATH\vue3-element-admin\node_modules\vite\dist\node\chunks\dep-0351185a.js:73834:57)
      at async Object.transform (PATH\vue3-element-admin\node_modules\vite\dist\node\chunks\dep-0351185a.js:36985:30)
      at async doTransform (PATH\vue3-element-admin\node_modules\vite\dist\node\chunks\dep-0351185a.js:52057:29)

Answer №1

Appreciate the feedback on my Egyptian ruler comment.

npm install <a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="7e08170a1b3e4c504f504e">[email protected]</a>

Issue has been successfully resolved.

Answer №2

Consider upgrading your "vite" and "@vitejs/plugin-vue" packages to the most recent releases.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

The error message "Cannot read property 'option0' of undefined" occurs when using Node.js with Express and EJS

script.js var choices = { choice0: 11, choice1: 'choice1', choice2: 'choice2', choice3: 'choice3', choice4: 'choice4', choice5: 'choice5', choice6: 'choice6', choice7: 'choice7', choice ...

The axios library fails to send formdata to the server

Recently, I've been working on an axios code to handle form data submission. Here's the snippet of the code: updatesetting: function(){ let formData = new FormData(); formData.append('email', this.email); formData.append(&a ...

Following the upgrade to version 6.3.3, an error appeared in the pipe() function stating TS2557: Expected 0 or more arguments, but received 1 or more

I need some assistance with rxjs 6.3.3 as I am encountering TS2557: Expected at least 0 arguments, but got 1 or more. let currentPath; const pipeArgs = path .map((subPath: string, index: number) => [ flatMap((href: string) => { con ...

What is the best way to implement forwardRef in a distinct select component?

Currently, I am utilizing react, typescript, and styled-components to work on my project. Specifically, I am aiming to create a select component for use in React Hook Form. Initially, everything seemed to be in order, but I encountered an error from typesc ...

Error: The specified object does not contain the 'tableRow' method

I am currently working on a contacts book project and I need a table to update as the user inputs data. However, I keep encountering an error related to 'tableRow'. I have tried changing function names and other solutions but haven't been ab ...

When implementing jQuery for scrolling on a website, touch gestures may become unresponsive on Safari for iOS devices

While developing a custom website with Angular, I encountered an issue specifically with Safari on iOS. The website is a single-page app with multiple menu sections that trigger a scroll animation when selected using jQuery. Everything was working smoothly ...

Mastering the Art of Broadcasting Routes in Vue 3 SPA with Laravel Sanctum

I'm currently configuring private-channel broadcasting using my vue 3 single page application in conjunction with a laravel sanctum backend. The broadcasting feature works fine when used without any authorization (for non-private channels), but as soo ...

This is some guidance on toggling the visibility of dynamically created divs in Vuejs when a button is clicked

I am working on a project where I have dynamically created buttons and divs. The goal is to show the corresponding div when a button is clicked, while hiding the rest of the divs. Since the number of buttons and divs is not predetermined as they are gene ...

javascript image alert

I want to upgrade a basic javascript alert to make it look more visually appealing. Currently, the alert is generated using if(isset($_GET['return'])) { // get a random item $sql = "SELECT * FROM pp_undergroundItems AS u LEFT JO ...

Using the decorator in VueJS Typescript allows you to easily define dynamic computed properties

On my hands is a component structured like this: @Component({ computed: { [this.stateModel]: { get() { return this.$store[this.stateModel]; } } } }) class Component extends Vue{ @Prop({ de ...

An issue arises when using JSON.parse() with regular expression values

I am encountering an issue with parsing a JSON string encoded with PHP 5.2 json_encode(). Here is the JSON string: {"foo":"\\."} Although this JSON string is valid according to jsonlint.com, when using the native JSON.parse() method in Chrome a ...

Is there a way for me to send a form containing pre-existing data from a different page?

Seeking advice: I realize that utilizing jQuery's ajax function may be the simplest approach, however I am facing an issue with the form field names. The var_dump below displays the typical values submitted by the form using test data. It appears that ...

Which event occurs first for a4j:jsFunction, reRender or oncomplete?

After running a jsFunction, I want the javascript to execute once the re-rendering is completed. I assume that the "oncomplete" javascript function is triggered after the re-rendering process, but I'm not entirely certain. Any insights on this? Appre ...

Is it possible to transfer an image from the client to the NodeJS server and store it locally within the server itself?

Is there a way for me to upload an image from the client side, send it via an HTTP request (POST) to the server (NodeJS), and save it internally on the server? Whether using Jquery, XMLHttpRequest, or a form, I continue to face the same issue where I can& ...

HTML link with "mailto:" not opening in a new tab

Just posted for the first time! I'm attempting to create a mailto link using 'templated' JavaScript that pulls specific data from a JSON object: var menu = { "menu": [ { "title": "let's talk", "link": "mailto:<a href ...

The npm postinstall script is functional, however, it does not complete successfully and ends

I have encountered an issue while trying to solve a problem with my project. In my package.json file, I have included a postinstall script that connects to a database and calls a function to write data into it. The script seems to be working fine as the da ...

Error message indicating an issue with ng-repeat when working with an

$http.get('***').success(function(data, status,response) { $scope.items=data; var getdata=JSON.stringify(data.D_Services); console.log(getdata); }); im retrieving in the console D_Services: "Wash,Tyres,Spares,Accessories"; Could someone please ...

Understanding the concept of mutable properties in Typescript

Why can the property 'name' in the class 'PersonImpl' be reassigned even though it is not declared as read-only in the Person interface? interface Person { readonly name: string; } interface Greeting extends Person { greet( ...

Having trouble with implementing ng-hide and ng-show functionality

I have been working on creating my very first Angular website and so far, everything has been going smoothly with the first page. However, I am facing an issue with the second page not appearing as expected when it meets the condition set with ng-show in t ...

Javascript, removeFromString

I'm currently working on a JavaScript function that takes in two strings. The first string is any sentence provided by the user, and the second string consists of letters to be removed from the original sentence. My approach involves converting both s ...