destroytoday.com

Vue + ESLint + Prettier conflicts

I need to vent. I spent yesterday casually getting Cushion’s dev environment in order, so that whenever I save a file, it automatically fixes any linting errors and formats the code based on my preference. While the day started optimistic, it ended without much progress and honestly not much confidence towards a peaceful conclusion. Without going too deep into it and reliving the frustration, ESLint and Prettier conflict a bit. I believe that can be overcome somehow, but then you throw into the mix that Vue has single file components that mix HTML, JavaScript, and CSS into the same file. That’s when anything goes and I have no idea if a specific config is even wired up or if something else is silencing it. I’d love to get to a point where everything auto-formats correctly upon save, but the last thing I want to say is that I spent the weekend battling this issue and getting nowhere. For now, I’m going to cut my losses—I’ve disabled Prettier and kept ESLint enabled, but turned off ESLint auto-fixing. If anyone has a solution, I’d love to know it.