Not formatting monorepo

[nhuxhr]

The formatter seems not to be working with monorepo!

I have three mono repo in a project (i.e. landing, servers, and studio), the landing dir is a Next.js app, while the servers dir contains multiple servers which are Nest.js apps, and finally, the studio dir is a Svelte (SvelteKit) app. If the working directory is the root/project folder prettier works perfectly on the landing and servers dir, and other files in the studio dir except for the .svelte files but the formatter works with .svelte files if the working directory is studio itself.

And my PC lag if I have multiple vscode instances running with other heavy applications (i.e. Docker, Firefox, Postman, etc)

What am I doing wrong!?

System info:

• OS: Ubuntu 22.04
• CPUs: Intel(R) Core(TM) i5-6300U CPU @ 2.40GHz (4 x 2500)
• GPU Status: 2d_canvas: unavailable_software canvas_oop_rasterization: disabled_off direct_rendering_display_compositor: disabled_off_ok gpu_compositing: disabled_software multiple_raster_threads: enabled_on opengl: disabled_off rasterization: disabled_software raw_draw: disabled_off_ok skia_renderer: enabled_on video_decode: disabled_software video_encode: disabled_software vulkan: disabled_off webgl: unavailable_software webgl2: unavailable_software webgpu: disabled_off
• Load (avg): 1, 0, 0
• Memory (System): 7.65GB (2.55GB free)
• Process Argv: --no-sandbox . --crash-reporter-id 93055eb6-6fd7-4a64-90ee-21296107114f
• Screen Reader: no
• VM: 0%

[dummdidumm]

Are you using pnpm? If yes, possible duplicate of #155

[nhuxhr]

Are you using pnpm? If yes, possible duplicate of #155

Nope! I'm using yarn and the Svelte project is TypeScript.

[max-got]

Exactly the same problem here. Monorepo with "/studio" and "/web" and the prettier plugin works only if i cd web && code .

[jerebtw]

I have the same problem

[ItzaMi]

Joining this issue since I have the same problem. Have a folder with a BE and FE project and just initialized a SvelteKit project inside the FE folder. prettier doesn't work unless I cd into the FE folder

[toqueteos]

Same problem here.

Output logs for Svelte plugin (VSCode opened from /tmp/monorepo):

Initialize language server at  file:///tmp/monorepo
Trying to load configs for /tmp/monorepo
Loaded config at  /tmp/monorepo/app/svelte.config.js
...
Error: Cannot find module 'prettier-plugin-svelte'
...

Output logs for Svelte plugin (VSCode opened from /tmp/monorepo/app):

Initialize language server at  file:///tmp/monorepo/app
Trying to load configs for /tmp/monorepo/app
Loaded config at  /tmp/monorepo/app/svelte.config.js

One way to resolve this might be to init Svelte language server from the same path as where the svelte.config.js is located (which would require to change how the language operates, first find config, then init from there).

[phcoliveira]

@jsxclan, @jerebtw, @ItzaMi and @toqueteos, I had some problems in configuring prettier in my monorepo setup. But I fixed them with this setting pluginSearchDirs. Take a look at my prettier config, which is at the root of the package: apps/client, hence the value of ../../, because NPM installed the plugin at the root of the monorepo.

I hope it helps.

/**
 * @type {import('prettier').Options}
 */
module.exports = {
  plugins: [require('prettier-plugin-tailwindcss')],
  pluginSearchDirs: ['.'],
  overrides: [{files: '*.svelte', options: {parser: 'svelte'}}],
  tailwindConfig: './tailwind.config.cjs',
  arrowParens: 'always',
  bracketSpacing: false,
  endOfLine: 'lf',
  plugins: [],
  pluginSearchDirs: ['../../'],
  printWidth: 80,
  semi: true,
  singleQuote: true,
  tabWidth: 2,
  trailingComma: 'es5',
  useTabs: false,
  svelteSortOrder: 'options-styles-scripts-markup',
  svelteStrictMode: true,
  svelteBracketNewLine: false,
  svelteAllowShorthand: false,
  svelteIndentScriptAndStyle: true,
};

[toqueteos]

@phcoliveira solution didn't work for me but I found a working alternative.

1. Rename .prettierrc to prettier.config.cjs
2. Set plugins: [require('prettier-plugin-svelte')]
3. It works!

Here's the default .prettierrc (as generated from npm create svelte@next) translated into JS:

/**
 * @type {import('prettier').Options}
 */
module.exports = {
    useTabs: true,
    singleQuote: true,
    trailingComma: 'none',
    printWidth: 100,
    plugins: [require('prettier-plugin-svelte')],
    pluginSearchDirs: ["."],
    overrides: [{ 'files': '*.svelte', 'options': { 'parser': 'svelte' } }]
};

[JL102]

Here's another example of svelte language tools somehow not being able to import modules that are inside a subfolder of the workspace root (the workspace root is ScoringApp-Serverless; all of the Svelte code and Svelte-related packages are in offline)

[ryoppippi]

Same problem with this monorepo https://github.com/vercel/turbo/tree/main/examples/with-svelte I used this (https://github.com/sveltejs/prettier-plugin-svelte/issues/311#issuecomment-1320254867) config, but pretttier doesn't look detect svelte files

PS: I manually added file extensions and it works fine

pnpm prettier  './**/*.{js,ts,mjs,cjs,json,svelte}' --write