search

lazarv / react-server

The easiest way to build React apps with server-side rendering
https://react-server.dev
MIT License
121 stars 6 forks source link

fails when `.react-server` not exists #32

Closed aheissenberger closed 2 months ago

aheissenberger commented 2 months ago

Describe the bug

Running pnpm dev - the problem exists for all examples using the router. You also get this if you delete the .react-server folder on an existing project.

> @lazarv/react-server-example-mantine@ dev /workspaces/react-server/examples/mantine
> react-server

react-server/0.0.0 starting development server
10:00:40 PM [react-server] Initializing router configuration
10:00:40 PM [react-server] Router configuration successful
10:00:40 PM [react-server] Adding source file about.tsx to router
10:00:40 PM [react-server] Adding source file carousels.tsx to router
10:00:40 PM [react-server] Adding source file charts.tsx to router
10:00:40 PM [react-server] Adding source file code.tsx to router
10:00:40 PM [react-server] Adding source file dropzones.tsx to router
10:00:40 PM [react-server] Adding source file forms.tsx to router
10:00:40 PM [react-server] Adding source file index.tsx to router
10:00:40 PM [react-server] Adding source file layout.tsx to router
10:00:40 PM [react-server] Adding source file modalsmanager.tsx to router
10:00:40 PM [react-server] Adding source file navigationprogresses.tsx to router
10:00:40 PM [react-server] Adding source file notifications.tsx to router
10:00:40 PM [react-server] Adding source file rte.tsx to router
10:00:40 PM [react-server] Adding source file spotlights.tsx to router
10:00:40 PM [react-server] Router configuration ready
10:00:40 PM [react-server] Server listening on
10:00:40 PM [react-server]   ➜  Local:   http://localhost:3000
10:00:40 PM [react-server]   ➜  Network: use --host to expose
10:00:40 PM [react-server] ✔ Ready in 328ms
node:internal/fs/promises:639
  return new FileHandle(await PromisePrototypeThen(
                        ^

Error: ENOENT: no such file or directory, open '/workspaces/react-server/examples/mantine/.react-server/react-server-router.d.ts'
    at open (node:internal/fs/promises:639:25)
    at writeFile (node:internal/fs/promises:1212:14)
    at Timeout.writeTypedRouter [as _onTimeout] (file:///workspaces/react-server/packages/react-server-router/plugin.mjs:393:9) {
  errno: -2,
  code: 'ENOENT',
  syscall: 'open',
  path: '/workspaces/react-server/examples/mantine/.react-server/react-server-router.d.ts'
}

Node.js v20.17.0
 ELIFECYCLE  Command failed with exit code 1.

Reproduction

git@github.com:lazarv/react-server.git

Steps to reproduce

  1. git clone original repository (tried directly on my computer and cloned into a fresh dev container)
  2. pnpm i
  3. cd examples/mantine
  4. pnpm dev

System Info

System:
    OS: Linux 6.10 Debian GNU/Linux 11 (bullseye) 11 (bullseye)
    CPU: (10) arm64 unknown
    Memory: 6.01 GB / 7.66 GB
    Container: Yes
    Shell: 5.1.4 - /bin/bash
  Binaries:
    Node: 20.17.0 - /usr/local/share/nvm/versions/node/v20.17.0/bin/node
    Yarn: 1.22.22 - /usr/bin/yarn
    npm: 10.8.2 - /usr/local/share/nvm/versions/node/v20.17.0/bin/npm
    pnpm: 9.10.0 - /usr/local/share/nvm/versions/node/v20.17.0/bin/pnpm
  npmPackages:
    @lazarv/react-server: workspace:^ => 0.0.0 
    @lazarv/react-server-router: workspace:^ => 0.0.0

Used Package Manager

pnpm

Logs

Click to expand! ```shell > @lazarv/react-server-example-mantine@ dev /workspaces/react-server/examples/mantine > react-server react-server/0.0.0 starting development server 10:08:16 PM [react-server] Initializing router configuration 10:08:16 PM [react-server] Router configuration successful vite:config using resolved config: { vite:config root: '/workspaces/react-server/examples/mantine', vite:config public: 'public', vite:config optimizeDeps: { vite:config holdUntilCrawlEnd: true, vite:config include: [ vite:config 'react-dom', vite:config 'react-dom/client', vite:config 'react-server-dom-webpack/client.browser', vite:config 'react', vite:config 'react/jsx-dev-runtime', vite:config 'react/jsx-runtime' vite:config ], vite:config exclude: [ '@mantine/core' ], vite:config needsInterop: [], vite:config extensions: [], vite:config noDiscovery: false, vite:config esbuildOptions: { preserveSymlinks: false, jsx: 'automatic' }, vite:config disabled: undefined, vite:config entries: undefined, vite:config force: false vite:config }, vite:config resolve: { vite:config mainFields: [ 'browser', 'module', 'jsnext:main', 'jsnext' ], vite:config conditions: [], vite:config externalConditions: [], vite:config external: [ 'dayjs' ], vite:config noExternal: [ /^(?![a-zA-Z]:)[\w@](?!.*:\/\/)/ ], vite:config extensions: [ vite:config '.mjs', '.js', vite:config '.mts', '.ts', vite:config '.jsx', '.tsx', vite:config '.json' vite:config ], vite:config dedupe: [ 'react', 'react-dom' ], vite:config preserveSymlinks: true, vite:config alias: [ vite:config [Object], [Object], vite:config [Object], [Object], vite:config [Object], [Object], vite:config [Object] vite:config ] vite:config }, vite:config build: { vite:config target: [ 'es2020', 'edge88', 'firefox78', 'chrome87', 'safari14' ], vite:config cssTarget: [ 'es2020', 'edge88', 'firefox78', 'chrome87', 'safari14' ], vite:config outDir: 'dist', vite:config assetsDir: 'assets', vite:config assetsInlineLimit: 4096, vite:config cssCodeSplit: true, vite:config sourcemap: false, vite:config rollupOptions: { output: [Object], onwarn: [Function: onwarn] }, vite:config minify: 'esbuild', vite:config terserOptions: {}, vite:config write: true, vite:config emptyOutDir: null, vite:config copyPublicDir: true, vite:config manifest: false, vite:config ssr: false, vite:config ssrManifest: false, vite:config ssrEmitAssets: false, vite:config emitAssets: false, vite:config reportCompressedSize: true, vite:config chunkSizeWarningLimit: 1000, vite:config watch: null, vite:config commonjsOptions: { include: [Array], extensions: [Array] }, vite:config dynamicImportVarsOptions: { warnOnError: true, exclude: [Array] }, vite:config modulePreload: { polyfill: true }, vite:config cssMinify: true, vite:config lib: false vite:config }, vite:config server: { vite:config preTransformRequests: true, vite:config middlewareMode: true, vite:config cors: false, vite:config hmr: { port: 24678 }, vite:config https: false, vite:config fs: { vite:config strict: true, vite:config allow: [Array], vite:config deny: [Array], vite:config cachedChecks: undefined vite:config }, vite:config sourcemapIgnoreList: [Function: isInNodeModules$1] vite:config }, vite:config publicDir: '/workspaces/react-server/examples/mantine/public', vite:config appType: 'custom', vite:config clearScreen: false, vite:config configFile: undefined, vite:config css: { vite:config postcss: '/workspaces/react-server/examples/mantine', vite:config lightningcss: undefined vite:config }, vite:config plugins: [ vite:config 'vite:optimized-deps', vite:config 'vite:watch-package-data', vite:config 'vite:pre-alias', vite:config 'alias', vite:config 'vite:react-babel', vite:config 'vite:react-refresh', vite:config 'react-server:use-client', vite:config 'react-server:optimize-deps', vite:config 'vite:modulepreload-polyfill', vite:config 'vite:resolve', vite:config 'vite:html-inline-proxy', vite:config 'vite:css', vite:config 'vite:esbuild', vite:config 'vite:json', vite:config 'vite:wasm-helper', vite:config 'vite:worker', vite:config 'vite:asset', vite:config '@lazarv/react-server-router', vite:config 'react-server:workspace', vite:config 'react-server:eval', vite:config 'react-server:runtime', vite:config 'react-server:use-client', vite:config 'react-server:use-server', vite:config 'react-server:use-server-inline', vite:config 'react-server:asset', vite:config 'vite:wasm-fallback', vite:config 'vite:define', vite:config 'vite:css-post', vite:config 'vite:worker-import-meta-url', vite:config 'vite:asset-import-meta-url', vite:config 'vite:dynamic-import-vars', vite:config 'vite:import-glob', vite:config 'vite:client-inject', vite:config 'vite:css-analysis', vite:config 'vite:import-analysis' vite:config ], vite:config cacheDir: '/workspaces/react-server/examples/mantine/node_modules/.react-server/.cache/client', vite:config customLogger: { vite:config hasWarned: false, vite:config info: [Function (anonymous)], vite:config warn: [Function (anonymous)], vite:config warnOnce: [Function (anonymous)], vite:config error: [Function: error], vite:config clearScreen: [Function: clearScreen], vite:config hasErrorLogged: [Function: hasErrorLogged] vite:config }, vite:config environments: { vite:config client: { vite:config resolve: [Object], vite:config nodeCompatible: false, vite:config webCompatible: true, vite:config injectInvalidationTimestamp: true, vite:config dev: [Object], vite:config build: [Object] vite:config }, vite:config ssr: { vite:config resolve: [Object], vite:config nodeCompatible: true, vite:config webCompatible: false, vite:config injectInvalidationTimestamp: false, vite:config dev: [Object], vite:config build: [Object] vite:config }, vite:config rsc: { vite:config resolve: [Object], vite:config nodeCompatible: true, vite:config webCompatible: false, vite:config injectInvalidationTimestamp: false, vite:config dev: [Object], vite:config build: [Object] vite:config } vite:config }, vite:config esbuild: { jsxDev: true, jsx: 'automatic', jsxImportSource: undefined }, vite:config configFileDependencies: [], vite:config inlineConfig: { vite:config root: '/workspaces/react-server/examples/mantine', vite:config public: 'public', vite:config optimizeDeps: { exclude: [Array], force: undefined, include: [Array] }, vite:config resolve: { vite:config alias: [Array], vite:config external: [Array], vite:config preserveSymlinks: true, vite:config noExternal: [Array] vite:config }, vite:config build: { chunkSizeWarningLimit: 1000, rollupOptions: [Object] }, vite:config server: { vite:config middlewareMode: true, vite:config cors: false, vite:config hmr: [Object], vite:config https: false, vite:config fs: [Object] vite:config }, vite:config publicDir: '/workspaces/react-server/examples/mantine/public', vite:config appType: 'custom', vite:config clearScreen: false, vite:config configFile: false, vite:config css: { postcss: '/workspaces/react-server/examples/mantine' }, vite:config plugins: [ vite:config [Promise], [Object], vite:config [Object], [Object], vite:config [Array], [Object], vite:config [Object], [Object], vite:config [Object], [Object], vite:config [Object] vite:config ], vite:config cacheDir: '/workspaces/react-server/examples/mantine/node_modules/.react-server/.cache/client', vite:config customLogger: { vite:config hasWarned: false, vite:config info: [Function (anonymous)], vite:config warn: [Function (anonymous)], vite:config warnOnce: [Function (anonymous)], vite:config error: [Function: error], vite:config clearScreen: [Function: clearScreen], vite:config hasErrorLogged: [Function: hasErrorLogged] vite:config }, vite:config environments: { client: [Object], ssr: [Object], rsc: [Object] } vite:config }, vite:config base: '/', vite:config rawBase: '/', vite:config command: 'serve', vite:config mode: 'development', vite:config isWorker: false, vite:config mainConfig: null, vite:config bundleChain: [], vite:config isProduction: false, vite:config builder: { vite:config sharedConfigBuild: false, vite:config sharedPlugins: false, vite:config entireApp: false, vite:config buildApp: [AsyncFunction: defaultBuildApp] vite:config }, vite:config preview: { vite:config port: undefined, vite:config strictPort: undefined, vite:config host: undefined, vite:config https: false, vite:config open: undefined, vite:config proxy: undefined, vite:config cors: false, vite:config headers: undefined vite:config }, vite:config envDir: '/workspaces/react-server/examples/mantine', vite:config env: { BASE_URL: '/', MODE: 'development', DEV: true, PROD: false }, vite:config assetsInclude: [Function: assetsInclude], vite:config logger: { vite:config hasWarned: false, vite:config info: [Function (anonymous)], vite:config warn: [Function (anonymous)], vite:config warnOnce: [Function (anonymous)], vite:config error: [Function: error], vite:config clearScreen: [Function: clearScreen], vite:config hasErrorLogged: [Function: hasErrorLogged] vite:config }, vite:config packageCache: Map(1) { vite:config 'fnpd_/workspaces/react-server/examples/mantine' => { vite:config dir: '/workspaces/react-server/examples/mantine', vite:config data: [Object], vite:config hasSideEffects: [Function: hasSideEffects], vite:config webResolvedImports: {}, vite:config nodeResolvedImports: {}, vite:config setResolvedCache: [Function: setResolvedCache], vite:config getResolvedCache: [Function: getResolvedCache] vite:config }, vite:config set: [Function (anonymous)] vite:config }, vite:config worker: { format: 'iife', plugins: '() => plugins', rollupOptions: {} }, vite:config experimental: { importGlobRestoreExtension: false, hmrPartialAccept: false }, vite:config future: undefined, vite:config ssr: { vite:config target: 'node', vite:config external: [ vite:config 'dayjs', vite:config 'react', vite:config 'react/jsx-runtime', vite:config 'react/jsx-dev-runtime', vite:config 'react-dom', vite:config 'react-dom/client', vite:config 'react-server-dom-webpack' vite:config ], vite:config noExternal: [ /^(?![a-zA-Z]:)[\w@](?!.*:\/\/)/ ], vite:config optimizeDeps: { vite:config include: [], vite:config exclude: [], vite:config needsInterop: [], vite:config extensions: [], vite:config noDiscovery: true, vite:config holdUntilCrawlEnd: true, vite:config esbuildOptions: [Object], vite:config disabled: undefined, vite:config entries: undefined, vite:config force: false vite:config }, vite:config resolve: { conditions: [Array], externalConditions: [Array] } vite:config }, vite:config dev: { vite:config sourcemap: { js: true }, vite:config sourcemapIgnoreList: [Function: isInNodeModules$1], vite:config preTransformRequests: false, vite:config warmup: [], vite:config optimizeDeps: { vite:config include: [], vite:config exclude: [], vite:config needsInterop: [], vite:config extensions: [], vite:config noDiscovery: true, vite:config holdUntilCrawlEnd: true, vite:config esbuildOptions: [Object], vite:config disabled: undefined, vite:config entries: undefined, vite:config force: false vite:config }, vite:config createEnvironment: undefined, vite:config recoverable: false, vite:config moduleRunnerTransform: true vite:config }, vite:config getSortedPlugins: [Function: getSortedPlugins], vite:config getSortedPluginHooks: [Function: getSortedPluginHooks], vite:config createResolver: [Function: createResolver] vite:config } +0ms connect:dispatcher use / viteTimeMiddleware +0ms connect:dispatcher use / viteCachedTransformMiddleware +0ms connect:dispatcher use /__open-in-editor launchEditorMiddleware +0ms connect:dispatcher use / viteHMRPingMiddleware +0ms connect:dispatcher use / viteServePublicMiddleware +0ms connect:dispatcher use / viteTransformMiddleware +0ms connect:dispatcher use / viteServeRawFsMiddleware +0ms connect:dispatcher use / viteServeStaticMiddleware +0ms connect:dispatcher use / viteErrorMiddleware +0ms vite:deps removing old cache dir /workspaces/react-server/examples/mantine/node_modules/.react-server/.cache/client/deps +0ms 10:08:16 PM [react-server] Adding source file about.tsx to router 10:08:16 PM [react-server] Adding source file carousels.tsx to router 10:08:16 PM [react-server] Adding source file charts.tsx to router 10:08:16 PM [react-server] Adding source file code.tsx to router 10:08:16 PM [react-server] Adding source file dropzones.tsx to router 10:08:16 PM [react-server] Adding source file forms.tsx to router 10:08:16 PM [react-server] Adding source file index.tsx to router 10:08:16 PM [react-server] Adding source file layout.tsx to router 10:08:16 PM [react-server] Adding source file modalsmanager.tsx to router 10:08:16 PM [react-server] Adding source file navigationprogresses.tsx to router 10:08:16 PM [react-server] Adding source file notifications.tsx to router 10:08:16 PM [react-server] Adding source file rte.tsx to router 10:08:16 PM [react-server] Adding source file spotlights.tsx to router 10:08:16 PM [react-server] Router configuration ready vite:resolve 0.79ms react-dom -> /workspaces/react-server/node_modules/.pnpm/react-dom@0.0.0-experimental-58af67a8f8-20240628_react@0.0.0-experimental-58af67a8f8-20240628/node_modules/react-dom/index.js +0ms vite:resolve 0.18ms react-dom/client -> /workspaces/react-server/node_modules/.pnpm/react-dom@0.0.0-experimental-58af67a8f8-20240628_react@0.0.0-experimental-58af67a8f8-20240628/node_modules/react-dom/client.js +0ms vite:resolve 0.10ms react-server-dom-webpack/client.browser -> /workspaces/react-server/node_modules/.pnpm/react-server-dom-webpack@0.0.0-experimental-58af67a8f8-20240628_react-dom@0.0.0-experimental-_kqbp32rqejxlfgm6awsrcrr3fi/node_modules/react-server-dom-webpack/client.browser.js +1ms vite:resolve 0.06ms react -> /workspaces/react-server/node_modules/.pnpm/react@0.0.0-experimental-58af67a8f8-20240628/node_modules/react/index.js +0ms vite:resolve 0.06ms react/jsx-dev-runtime -> /workspaces/react-server/node_modules/.pnpm/react@0.0.0-experimental-58af67a8f8-20240628/node_modules/react/jsx-dev-runtime.js +0ms vite:resolve 0.06ms react/jsx-runtime -> /workspaces/react-server/node_modules/.pnpm/react@0.0.0-experimental-58af67a8f8-20240628/node_modules/react/jsx-runtime.js +0ms vite:deps scanning for dependencies... +0ms connect:dispatcher use / anonymous +35ms 10:08:16 PM [react-server] Server listening on 10:08:16 PM [react-server] ➜ Local: http://localhost:3000 10:08:16 PM [react-server] ➜ Network: use --host to expose 10:08:16 PM [react-server] ✔ Ready in 261ms vite:deps Scan completed in 16.64ms: no dependencies found +0ms vite:deps creating package.json in /workspaces/react-server/examples/mantine/node_modules/.react-server/.cache/client/deps_temp_c1352ae3 +40ms vite:resolve 0.33ms react -> /workspaces/react-server/node_modules/.pnpm/react@0.0.0-experimental-58af67a8f8-20240628/node_modules/react/index.js +80ms vite:resolve 0.32ms react -> /workspaces/react-server/node_modules/.pnpm/react@0.0.0-experimental-58af67a8f8-20240628/node_modules/react/index.js +0ms vite:resolve 0.34ms react -> /workspaces/react-server/node_modules/.pnpm/react@0.0.0-experimental-58af67a8f8-20240628/node_modules/react/index.js +0ms vite:resolve 0.33ms react -> /workspaces/react-server/node_modules/.pnpm/react@0.0.0-experimental-58af67a8f8-20240628/node_modules/react/index.js +0ms vite:resolve 0.08ms react-dom -> /workspaces/react-server/node_modules/.pnpm/react-dom@0.0.0-experimental-58af67a8f8-20240628_react@0.0.0-experimental-58af67a8f8-20240628/node_modules/react-dom/index.js +1ms vite:resolve 0.83ms scheduler -> /workspaces/react-server/node_modules/.pnpm/scheduler@0.0.0-experimental-58af67a8f8-20240628/node_modules/scheduler/index.js +2ms vite:deps Dependencies bundled in 97.78ms +99ms node:internal/fs/promises:639 return new FileHandle(await PromisePrototypeThen( ^ Error: ENOENT: no such file or directory, open '/workspaces/react-server/examples/mantine/.react-server/react-server-router.d.ts' at open (node:internal/fs/promises:639:25) at writeFile (node:internal/fs/promises:1212:14) at Timeout.writeTypedRouter [as _onTimeout] (file:///workspaces/react-server/packages/react-server-router/plugin.mjs:393:9) { errno: -2, code: 'ENOENT', syscall: 'open', path: '/workspaces/react-server/examples/mantine/.react-server/react-server-router.d.ts' } Node.js v20.17.0  ELIFECYCLE  Command failed with exit code 1. ```

Validations

lazarv commented 2 months ago

This was my bad, caused by moving out the Vite cache directory from .react-server and not ensuring that the directory exists when emitting the generated router type definition file.

github-actions[bot] commented 1 month ago

This issue has been locked since it has been closed for more than 30 days.

If you have found a concrete bug or regression related to it, please open a new bug report with a reproduction against the latest version of @lazarv/react-server. If you have any other comments you should create a new discussion.