Editor setup

Of course, you can use any IDE you like, but you'll have the best possible developer experience with this starter kit when using a VSCode-based editor with the suggested settings and extensions.

Settings

We've included the recommended settings in the .vscode/settings.json file. They wire up Oxfmt and Oxlint to run on save and hide the generated route tree from search and watchers. You can adjust them to your needs.

{
  "oxc.fmt.configPath": "oxfmt.config.ts",
  "editor.defaultFormatter": "oxc.oxc-vscode",
  "editor.codeActionsOnSave": {
    "source.fixAll.oxc": "always"
  },
  "editor.formatOnSave": true
  ...
}

Extensions

Once you've cloned the project and opened it in VSCode, you should be prompted to install the suggested extensions, which are defined in .vscode/extensions.json. If you'd rather install them manually, you can do so at any time.

OXC

Global extension for static code analysis. It formats with Oxfmt and reports problems from Oxlint, including real TypeScript errors, because the lint config is type-aware. It's compatible with Prettier and ESLint.

Tailwind CSS IntelliSense

Autocomplete, syntax highlighting, and linting for Tailwind CSS classes. Class sorting is handled by Oxfmt on save.

Follow the coding conventions for imports, server modules, and translated copy. If you use an AI coding assistant, configure the shipped agent rules and skills too. The common commands show how to run the same checks outside your editor.