Been trying out TSRX with a fresh TanStack Start app. Repo with the details and a stress-test page per TSRX feature: https://github.com/jamiedavenport/example-tsrx-tanstack
Found two things on the TanStack side worth flagging.
Dev SSR drops CSS from virtual modules
@tanstack/start-plugin-core's dev stylesheet collector (dev-styles.js) checks isCssFile(dep.file ?? dep.url). Vite always strips the query string off a resolved id to get ModuleNode.file, so a virtual module like <path>.tsrx?tsrx-css&lang.css ends up with .file = ...tsrx — not .css. The check fails and never falls through to .url, which does end in ...lang.css.
So scoped styles from .tsrx components just don't show up in the initial SSR HTML in dev (shows up after hydration instead). Production build is fine — Rollup's CSS chunking doesn't go through this.
Probably affects anything else using this "extension only lives in the query string" pattern too, e.g. Vue SFC <style> blocks.
Route file extensions are hardcoded
@tanstack/router-generator's directory walker hardcodes:
else if (fullPath.match(/\.(tsx|ts|jsx|js|vue)$/)) {
.tsrx doesn't match, so it only works as a component a .tsx route imports, not as a route file itself. .vue already gets special-cased here, so there's precedent, just not generalized.
Happy to send a PR for either, but wanted to check first since TSRX is still early — didn't want to assume it's worth building support for yet.
Been trying out TSRX with a fresh TanStack Start app. Repo with the details and a stress-test page per TSRX feature: https://github.com/jamiedavenport/example-tsrx-tanstack
Found two things on the TanStack side worth flagging.
Dev SSR drops CSS from virtual modules
@tanstack/start-plugin-core's dev stylesheet collector (dev-styles.js) checksisCssFile(dep.file ?? dep.url). Vite always strips the query string off a resolved id to getModuleNode.file, so a virtual module like<path>.tsrx?tsrx-css&lang.cssends up with.file=...tsrx— not.css. The check fails and never falls through to.url, which does end in...lang.css.So scoped styles from
.tsrxcomponents just don't show up in the initial SSR HTML in dev (shows up after hydration instead). Production build is fine — Rollup's CSS chunking doesn't go through this.Probably affects anything else using this "extension only lives in the query string" pattern too, e.g. Vue SFC
<style>blocks.Route file extensions are hardcoded
@tanstack/router-generator's directory walker hardcodes:.tsrxdoesn't match, so it only works as a component a.tsxroute imports, not as a route file itself..vuealready gets special-cased here, so there's precedent, just not generalized.Happy to send a PR for either, but wanted to check first since TSRX is still early — didn't want to assume it's worth building support for yet.