前言
最近打算对项目内的vite、vue 和 element-plus 版本升级, 安装完毕之后启动项目,结果不出意外的出意外了
点进去看下怎么回事
根据警告和报错有点懵,看起来routerview有问题?然后顺势也吧vue-router也升级到最新,结果发现并没有用。没办法,逐个排查吧。
寻找原因
先回退版本,重新挨个升级看下报错情况,经过排查发现问题出在vite上,原来的vite版本是 2.5.4,升级到2.9+就又出现问题了
16:40:58 [vite] Internal server error: Failed to resolve import "@vue/server-renderer" from "src\App.vue". Does the file exist?
Plugin: vite:import-analysis
File: F:/script_zhao/learning/vite-element-plus-zhao-template/src/App.vue
12 | });
13 | import { resolveComponent as _resolveComponent, withCtx as _withCtx, createVNode as _createVNode, mergeProps as _mergeProps } from "vue";
14 | import { ssrRenderComponent as _ssrRenderComponent } from "@vue/server-renderer";
| ^
15 | function _sfc_ssrRender(_ctx, _push, _parent, _attrs, $props, $setup, $data, $options) {
16 | const _component_router_view = _resolveComponent("router-view");
at formatError (F:\script_zhao\learning\vite-element-plus-zhao-template\node_modules\vite\dist\node\chunks\dep-c9998dc6.js:39080:46)
at TransformContext.error (F:\script_zhao\learning\vite-element-plus-zhao-template\node_modules\vite\dist\node\chunks\dep-c9998dc6.js:39076:19)
at normalizeUrl (F:\script_zhao\learning\vite-element-plus-zhao-template\node_modules\vite\dist\node\chunks\dep-c9998dc6.js:58354:26)
at processTicksAndRejections (node:internal/process/task_queues:96:5)
at async TransformContext.transform (F:\script_zhao\learning\vite-element-plus-zhao-template\node_modules\vite\dist\node\chunks\dep-c9998dc6.js:58503:57)
at async Object.transform (F:\script_zhao\learning\vite-element-plus-zhao-template\node_modules\vite\dist\node\chunks\dep-c9998dc6.js:39317:30)
at async doTransform (F:\script_zhao\learning\vite-element-plus-zhao-template\node_modules\vite\dist\node\chunks\dep-c9998dc6.js:50037:29)
解决问题
既然找到一点眉目那就再查找一下关于vite的依赖项,其中一个官方插件 @vitejs/plugin-vue在GitHub仓库里看到有个关于更新依赖的提交,对照了下项目的版本似乎差了有亿点多,接着把它升级到最新,重启项目,成功!