Incompatible with Prettier v3

yannbertrand commented 1 year ago

[x] I confirm that this is an issue rather than a question.

Bug report

Steps to reproduce

Set up a new project with yarn create vuepress-site
cd docs && yarn install
yarn add -D prettier
yarn dev

Example codesandbox: https://codesandbox.io/p/sandbox/sharp-sanne-f5rkww

What is expected?

VuePress dev server should launch with no issues.

What is actually happening?

VuePress dev server launch with errors, the http://localhost:8080 web page displays a blank page with the devtools full of errors.

Other relevant information

Output of npx vuepress info in my VuePress project:

Environment Info:

  System:
    OS: Linux 6.1 Debian GNU/Linux 11 (bullseye) 11 (bullseye)
    CPU: (2) x64 AMD EPYC
  Binaries:
    Node: 16.17.0 - /tmp/yarn--1692349612835-0.9656215354670268/node
    Yarn: 1.22.19 - /tmp/yarn--1692349612835-0.9656215354670268/yarn
    npm: 8.15.0 - /usr/local/bin/npm
  Browsers:
    Chrome: Not Found
  npmPackages:
    @vuepress/core:  1.9.10 
    @vuepress/theme-default:  1.9.10 
    vuepress: ^1.9.10 => 1.9.10 
  npmGlobalPackages:
    vuepress: Not Found

mistic100 commented 1 year ago

Wow thank you for openning this issue, I was pulling my hair to understand why the dev server wasn't working anymore ! I confirm that removing prettier (and probably downgrade to v2) solves the issue.

To add a bit more context : this does not affect the production build.

The errors are all like this:

Uncaught Error: Module build failed (from ./node_modules/babel-loader/lib/index.js): SyntaxError: /var/mistic/Photo-Sphere-Viewer/node_modules/@vuepress/core/lib/client/components/GlobalLayout.vue: Unexpected token, expected "," (1:8)

I don't really understand what could cause that as prettier has no dependencies at all (confirmed by looking at the diff of my yarn.lock file).

yannbertrand commented 1 year ago

I confirm that removing prettier (and probably downgrade to v2) solves the issue.

I confirm that downgrading prettier to v2 works as well, without reformating.

Thanks for the context additions!

vuejs / vuepress