[Bug report] vuepress broken with vite@2.9

[zS1L3NT]

Workaround

Hi everyone, here is a possible workaround.

If you are using yarn, add "resolution" in your package.json and force using vite@2.8, then everything should work fine.

{
 // ...
  "resolutions": {
    "vite": "2.8.6"
  },
}

If you are using npm, please make sure you are using vite@2.8.x by manualy declare "vite": "2.8.6" then a clean install. That should work in most cases.

We are actually not responsable for potential breaking changes from deps chain. 🙂 Give us some time to investigate and fix this.

-- Mr.Hope from VuePress Team

---

Here is the original issue:

Bug report

Description

VuePress was showing me this error on useThemeLocaleData(), so what I did was that I made a new branch and deleted all my project's dependencies and files, leaving only the VuePress code.

I deleted my node_modules folder and pnpm-lock.yaml, then did a pnpm i to install the node_modules and create the pnpm-lock.yaml again. However this still did not work and showed the same error.

Steps to reproduce

You can clone the repository here

Expected behavior

An empty VuePress app to run

Screenshots

Environment info

• Browser:

• Output of vuepress info:

  System:
    OS: Windows 10 10.0.22581
    CPU: (12) x64 AMD Ryzen 5 3600 6-Core Processor
    Memory: 2.95 GB / 15.95 GB
  Binaries:
    Node: 16.10.0 - C:\Program Files\nodejs\node.EXE
    Yarn: 1.22.17 - ~\AppData\Roaming\npm\yarn.CMD
    npm: 8.5.2 - C:\Program Files\nodejs\npm.CMD
  Utilities:
    Git: 2.34.1.
  Browsers:
    Chrome: Not Found
    Edge: Spartan (44.22581.100.0), Chromium (99.0.1150.55)
  npmPackages:
    @vuepress/bundler-vite:  2.0.0-beta.36
    @vuepress/bundler-webpack: Not Found
    @vuepress/cli:  2.0.0-beta.36
    @vuepress/client:  2.0.0-beta.35
    @vuepress/core:  2.0.0-beta.36
    @vuepress/markdown:  2.0.0-beta.36
    @vuepress/plugin-active-header-links:  2.0.0-beta.36
    @vuepress/plugin-back-to-top:  2.0.0-beta.36
    @vuepress/plugin-container:  2.0.0-beta.36
    @vuepress/plugin-docsearch: Not Found
    @vuepress/plugin-external-link-icon:  2.0.0-beta.36
    @vuepress/plugin-git:  2.0.0-beta.36
    @vuepress/plugin-google-analytics: Not Found
    @vuepress/plugin-medium-zoom:  2.0.0-beta.36
    @vuepress/plugin-nprogress:  2.0.0-beta.36
    @vuepress/plugin-palette:  2.0.0-beta.36
    @vuepress/plugin-prismjs:  2.0.0-beta.36
    @vuepress/plugin-pwa: Not Found
    @vuepress/plugin-pwa-popup: Not Found
    @vuepress/plugin-register-components: Not Found
    @vuepress/plugin-search: Not Found
    @vuepress/plugin-shiki: Not Found
    @vuepress/plugin-theme-data:  2.0.0-beta.36
    @vuepress/plugin-toc: Not Found
    @vuepress/shared:  2.0.0-beta.35
    @vuepress/theme-default:  2.0.0-beta.36
    @vuepress/utils:  2.0.0-beta.35
    vue:  3.2.31
    vue-loader: Not Found
    vue-router:  4.0.14
    vuepress: ^2.0.0-beta.36 => 2.0.0-beta.36
    vuepress-vite:  2.0.0-beta.36
    vuepress-webpack: Not Found

[dacodekid]

I can confirm the same issue started for me as well.

[dacodekid]

@Mister-Hope , so far..

1. I deleted everything and started from scratch
2. Tried pnpm & npm
3. Tried to install Beta 35 & 34

but none seems to work at this point. When the server starts, none of the packages (such as vuepress-router) gets started.

[Mister-Hope]

please double check whether you have different versions of @vue/xxxx and @vite/xxx packages installed,

Please check this,

Vite released new version yesterday,may caused by that.

also, you may try using vite@2.8 with "vite": "~2.8.0". I think I had explained the necesary part. It's not related to VuePress version, but releated to deps tree on vite.

[dacodekid]

@Mister-Hope I agree. I'm pretty sure it is vite that causing the trouble (a couple times, I saw a different error regards version numbers - but I didn't copy the error message and now I couldn't reproduce. It was some like it was expecting version 12.x but 14.x was there) .

Changing to webpack bundler works fine. But I couldn't use Vite 2.8.0 as even I install it manually, vuepress by default using vite 2.9. Not sure how to force that. I'll use webpack for time being.

devDependencies:
+ @vuepress/bundler-webpack 2.0.0-beta.36
+ vite 2.8.0 (2.9.0 is available)
+ vuepress 2.0.0-beta.36
+ webpack 5.70.0

vuepress dev docs

info Initializing VuePress and preparing data...

  vite v2.9.0 dev server running at:

  > Local:    http://localhost:8080/
  > Network:  http://192.168.1.138:8080/

[Mister-Hope]

vuepress by default using vite 2.9

Nope

https://github.com/vuepress/vuepress-next/blob/b1ebbf3a4b584651314430cbed1a719568647bbe/packages/%40vuepress/bundler-vite/package.json#L43

You should be able to use latest vite@2.8.x

[Mister-Hope]

#784 may fix this

[Mister-Hope]

Hi everyone, here is a possible workaround.

If you are using yarn, add "resolution" in your package.json and force using vite@2.8, then everything should be working fine.

{
  // ...
  "resolutions": {
    "vite": "2.8.6"
  },
}

We are actually not responsable for potential breaking changes from deps chain. 🙂 Give us some time to investigate and fix this.

[meteorlxy]

vitejs/vite#7379 introduced some internal breaking changes, which broke the internal workaround plugin of vuepress-next.

I'll update the workaround plugin soon. It's still a workaround, and we need to find a way to solve it completely in the future.

[Mister-Hope]

New related bug #800. We will fix it soon.