timothymiller / t4-app

A powerful cross-platform UI toolkit for building actually native iOS, Android, macOS, Windows, Linux, and Progressive Web Apps with React (Native).
https://t4stack.com
MIT License
1.31k stars 70 forks source link

Nextjs issues from basic template #94

Closed szebert closed 8 months ago

szebert commented 8 months ago

Trying to get the most basic template running doing these steps:

  1. Ran pnpm create t4-app@latest test-t4-app
  2. Made a new Supabase project and included its details in my .env and .dev.vars files
  3. Made a new Cloudflare worker with a D1 and included its details in my .dev.vars and wrangler.toml files
  4. Ran bun migrate:local
  5. Ran bun dev

Got this when trying to open localhost:3000 on the latest Chrome browser:

szebert@Szeberts-MBP test-t4-app % bun dev
$ turbo dev --parallel --filter={next-app,@t4/api}
• Packages in scope: @t4/api, next-app
• Running dev in 2 packages
• Remote caching disabled
@t4/api:dev: cache bypass, force executing 7e2a0f5f005d9f10
next-app:dev: cache bypass, force executing 18690528f590b5f3
@t4/api:dev: $ wrangler dev
next-app:dev: $ bun with-env next dev
next-app:dev: $ dotenv -e ../../.env.local -- next dev
@t4/api:dev:  ⛅️ wrangler 3.15.0
@t4/api:dev: -------------------
@t4/api:dev: ▲ [WARNING] Enabling Node.js compatibility mode for built-ins and globals. This is experimental and has serious tradeoffs. Please see https://github.com/ionic-team/rollup-plugin-node-polyfills/ for more details.
@t4/api:dev: 
@t4/api:dev: 
@t4/api:dev: Using vars defined in .dev.vars
@t4/api:dev: Your worker has access to the following bindings:
@t4/api:dev: - D1 Databases:
@t4/api:dev:   - DB: production (9d318023-ad95-4a28-839d-2cfb8dbcbb1e)
@t4/api:dev: - Vars:
@t4/api:dev:   - APP_URL: "(hidden)"
@t4/api:dev:   - JWT_VERIFICATION_KEY: "(hidden)"
@t4/api:dev:   - DATABASE_ID: "(hidden)"
@t4/api:dev: ⎔ Starting local server...
hello
[mf:inf] Ready on http://0.0.0.0:8787
[mf:inf] - http://127.0.0.1:8787
[mf:inf] - http://192.168.1.70:8787
[mf:inf] - http://192.168.1.69:8787
@t4/api:dev: 
next-app:dev:  ○ (pwa) PWA support is disabled.
next-app:dev:  ○ (pwa) PWA support is disabled.
next-app:dev:   ▲ Next.js 13.5.6
next-app:dev:   - Local:        http://localhost:3000
next-app:dev:   - Environments: .env
next-app:dev:   - Experiments (use at your own risk):
next-app:dev:      · scrollRestoration
next-app:dev:      · forceSwcTransforms
next-app:dev: 
next-app:dev:  ✓ Ready in 3.9s
next-app:dev: <w> [webpack.cache.PackFileCacheStrategy/webpack.FileSystemInfo] Resolving 'next/dist/compiled/webpack/webpack-lib' in /Users/szebert/CodeProjects/test-t4-app/node_modules/@ducanh2912/next-pwa/dist for build dependencies doesn't lead to expected result '/Users/szebert/CodeProjects/test-t4-app/node_modules/next/dist/compiled/webpack/webpack-lib.js', but to '/Users/szebert/CodeProjects/test-t4-app/node_modules/@ducanh2912/next-pwa/node_modules/next/dist/compiled/webpack/webpack-lib.js' instead. Resolving dependencies are ignored for this path.
next-app:dev: <w>  at unknown 4 next/dist/compiled/webpack/webpack-lib
next-app:dev: <w>  at file dependencies /Users/szebert/CodeProjects/test-t4-app/node_modules/@ducanh2912/next-pwa/dist/index.cjs
next-app:dev: <w>  at file /Users/szebert/CodeProjects/test-t4-app/node_modules/@ducanh2912/next-pwa/dist/index.cjs
next-app:dev: <w>  at file dependencies /Users/szebert/CodeProjects/test-t4-app/apps/next/next.config.js
next-app:dev: <w>  at file /Users/szebert/CodeProjects/test-t4-app/apps/next/next.config.js
next-app:dev: <w>  at resolve commonjs /Users/szebert/CodeProjects/test-t4-app/apps/next/next.config.js
next-app:dev: <w> [webpack.cache.PackFileCacheStrategy/webpack.FileSystemInfo] Resolving 'next/dist/compiled/webpack/webpack-lib' in /Users/szebert/CodeProjects/test-t4-app/node_modules/@tamagui/next-plugin/dist/cjs for build dependencies doesn't lead to expected result '/Users/szebert/CodeProjects/test-t4-app/node_modules/next/dist/compiled/webpack/webpack-lib.js', but to '/Users/szebert/CodeProjects/test-t4-app/node_modules/@tamagui/next-plugin/node_modules/next/dist/compiled/webpack/webpack-lib.js' instead. Resolving dependencies are ignored for this path.
next-app:dev: <w>  at unknown 4 next/dist/compiled/webpack/webpack-lib
next-app:dev: <w>  at file dependencies /Users/szebert/CodeProjects/test-t4-app/node_modules/@tamagui/next-plugin/dist/cjs/withTamagui.js
next-app:dev: <w>  at file /Users/szebert/CodeProjects/test-t4-app/node_modules/@tamagui/next-plugin/dist/cjs/withTamagui.js
next-app:dev: <w>  at file dependencies /Users/szebert/CodeProjects/test-t4-app/node_modules/@tamagui/next-plugin/dist/cjs/index.js
next-app:dev: <w>  at file /Users/szebert/CodeProjects/test-t4-app/node_modules/@tamagui/next-plugin/dist/cjs/index.js
next-app:dev: <w>  at file dependencies /Users/szebert/CodeProjects/test-t4-app/apps/next/next.config.js
next-app:dev: <w>  at file /Users/szebert/CodeProjects/test-t4-app/apps/next/next.config.js
next-app:dev: <w>  at resolve commonjs /Users/szebert/CodeProjects/test-t4-app/apps/next/next.config.js
next-app:dev: 
next-app:dev:     ➡ [tamagui] built config and components (1388ms):
next-app:dev: 
next-app:dev:         Config     ./.tamagui/tamagui.config.cjs
next-app:dev:         Components ./.tamagui/tamagui-components.config.cjs
next-app:dev:              ./.tamagui/t4ui-components.config.cjs
next-app:dev:         
next-app:dev: Tamagui failed loading "/Users/szebert/CodeProjects/test-t4-app/apps/next/.tamagui/tamagui.config.cjs"
next-app:dev:   
next-app:dev:   Cannot access 'Stack' before initialization
next-app:dev:   ReferenceError: Cannot access 'Stack' before initialization
next-app:dev:     at Object.Stack (/Users/szebert/CodeProjects/test-t4-app/node_modules/@tamagui/core/dist/cjs/index.js:17:16)
next-app:dev:     at Object.get (/Users/szebert/CodeProjects/test-t4-app/node_modules/@tamagui/core/dist/cjs/index.js:11:88)
next-app:dev:     at Object.<anonymous> (/Users/szebert/CodeProjects/test-t4-app/node_modules/@tamagui/core/dist/cjs/index.js:24:26)
next-app:dev:     at Module._compile (node:internal/modules/cjs/loader:1241:14)
next-app:dev:     at Module._compile (/Users/szebert/CodeProjects/test-t4-app/node_modules/esbuild-register/dist/node.js:2258:26)
next-app:dev:     at Module._extensions..js (node:internal/modules/cjs/loader:1295:10)
next-app:dev:     at Object.newLoader (/Users/szebert/CodeProjects/test-t4-app/node_modules/esbuild-register/dist/node.js:2262:9)
next-app:dev:     at extensions..js (/Users/szebert/CodeProjects/test-t4-app/node_modules/esbuild-register/dist/node.js:4838:24)
next-app:dev:     at Module.load (node:internal/modules/cjs/loader:1091:32)
next-app:dev:     at Module._load (node:internal/modules/cjs/loader:938:12)
next-app:dev:     at Module.require (node:internal/modules/cjs/loader:1115:19)
next-app:dev:     at mod.require (/Users/szebert/CodeProjects/test-t4-app/node_modules/next/dist/server/require-hook.js:64:28)
next-app:dev:     at /Users/szebert/CodeProjects/test-t4-app/node_modules/@tamagui/static/dist/cjs/registerRequire.js:48:88
next-app:dev:     at requireTamaguiCore (/Users/szebert/CodeProjects/test-t4-app/node_modules/@tamagui/static/dist/cjs/helpers/requireTamaguiCore.js:23:10)
next-app:dev:     at Module.tamaguiRequire [as require] (/Users/szebert/CodeProjects/test-t4-app/node_modules/@tamagui/static/dist/cjs/registerRequire.js:48:63)
next-app:dev: 
next-app:dev:   
next-app:dev: Tamagui failed loading "/Users/szebert/CodeProjects/test-t4-app/apps/next/.tamagui/tamagui-components.config.cjs"
next-app:dev:   
next-app:dev:   Cannot access 'Stack' before initialization
next-app:dev:   ReferenceError: Cannot access 'Stack' before initialization
next-app:dev:     at Object.Stack (/Users/szebert/CodeProjects/test-t4-app/node_modules/@tamagui/core/dist/cjs/index.js:17:16)
next-app:dev:     at Object.get (/Users/szebert/CodeProjects/test-t4-app/node_modules/@tamagui/core/dist/cjs/index.js:11:88)
next-app:dev:     at Object.<anonymous> (/Users/szebert/CodeProjects/test-t4-app/node_modules/@tamagui/core/dist/cjs/index.js:24:26)
next-app:dev:     at Module._compile (node:internal/modules/cjs/loader:1241:14)
next-app:dev:     at Module._compile (/Users/szebert/CodeProjects/test-t4-app/node_modules/esbuild-register/dist/node.js:2258:26)
next-app:dev:     at Module._extensions..js (node:internal/modules/cjs/loader:1295:10)
next-app:dev:     at newLoader (/Users/szebert/CodeProjects/test-t4-app/node_modules/esbuild-register/dist/node.js:2262:9)
next-app:dev:     at Object.newLoader (/Users/szebert/CodeProjects/test-t4-app/node_modules/esbuild-register/dist/node.js:2262:9)
next-app:dev:     at extensions..js (/Users/szebert/CodeProjects/test-t4-app/node_modules/esbuild-register/dist/node.js:4838:24)
next-app:dev:     at Module.load (node:internal/modules/cjs/loader:1091:32)
next-app:dev:     at Module._load (node:internal/modules/cjs/loader:938:12)
next-app:dev:     at Module.require (node:internal/modules/cjs/loader:1115:19)
next-app:dev:     at mod.require (/Users/szebert/CodeProjects/test-t4-app/node_modules/next/dist/server/require-hook.js:64:28)
next-app:dev:     at /Users/szebert/CodeProjects/test-t4-app/node_modules/@tamagui/static/dist/cjs/registerRequire.js:48:88
next-app:dev:     at requireTamaguiCore (/Users/szebert/CodeProjects/test-t4-app/node_modules/@tamagui/static/dist/cjs/helpers/requireTamaguiCore.js:23:10)
next-app:dev: 
next-app:dev:   
next-app:dev: Tamagui failed loading "/Users/szebert/CodeProjects/test-t4-app/apps/next/.tamagui/t4ui-components.config.cjs"
next-app:dev:   
next-app:dev:   Cannot access 'Stack' before initialization
next-app:dev:   ReferenceError: Cannot access 'Stack' before initialization
next-app:dev:     at Object.Stack (/Users/szebert/CodeProjects/test-t4-app/node_modules/@tamagui/core/dist/cjs/index.js:17:16)
next-app:dev:     at Object.get (/Users/szebert/CodeProjects/test-t4-app/node_modules/@tamagui/core/dist/cjs/index.js:11:88)
next-app:dev:     at Object.<anonymous> (/Users/szebert/CodeProjects/test-t4-app/node_modules/@tamagui/core/dist/cjs/index.js:24:26)
next-app:dev:     at Module._compile (node:internal/modules/cjs/loader:1241:14)
next-app:dev:     at Module._compile (/Users/szebert/CodeProjects/test-t4-app/node_modules/esbuild-register/dist/node.js:2258:26)
next-app:dev:     at Module._extensions..js (node:internal/modules/cjs/loader:1295:10)
next-app:dev:     at newLoader (/Users/szebert/CodeProjects/test-t4-app/node_modules/esbuild-register/dist/node.js:2262:9)
next-app:dev:     at Object.newLoader (/Users/szebert/CodeProjects/test-t4-app/node_modules/esbuild-register/dist/node.js:2262:9)
next-app:dev:     at extensions..js (/Users/szebert/CodeProjects/test-t4-app/node_modules/esbuild-register/dist/node.js:4838:24)
next-app:dev:     at Module.load (node:internal/modules/cjs/loader:1091:32)
next-app:dev:     at Module._load (node:internal/modules/cjs/loader:938:12)
next-app:dev:     at Module.require (node:internal/modules/cjs/loader:1115:19)
next-app:dev:     at mod.require (/Users/szebert/CodeProjects/test-t4-app/node_modules/next/dist/server/require-hook.js:64:28)
next-app:dev:     at /Users/szebert/CodeProjects/test-t4-app/node_modules/@tamagui/static/dist/cjs/registerRequire.js:48:88
next-app:dev:     at requireTamaguiCore (/Users/szebert/CodeProjects/test-t4-app/node_modules/@tamagui/static/dist/cjs/helpers/requireTamaguiCore.js:23:10)
next-app:dev: 
next-app:dev:   
next-app:dev: Missing theme, an error occurred when importing your config
next-app:dev: Got config: [Function (anonymous)] {
next-app:dev:   displayName: 'ProxyWorm - Check excludeReactNativeWebExports',
next-app:dev:   _isProxyWorm: true
next-app:dev: }
next-app:dev: Looking for theme: displayName
next-app:dev: 
nilesh-auz commented 8 months ago

Facing same issue:

➜ t4-app git:(main) ✗ bun run web
$ cd apps/next && bun run dev $ bun with-env next dev $ dotenv -e ../../.env.local -- next dev ○ (pwa) PWA support is disabled. ○ (pwa) PWA support is disabled. ▲ Next.js 13.5.6

⚠️ Tamagui Warning [001]: Skipping loading /t4-app/apps/next/.tamagui/tamagui.config.cjs due to error bundling.

⚠️ Tamagui Warning [001]: Skipping loading /t4-app/apps/next/.tamagui/tamagui-components.config.cjs due to error bundling.

⚠️ Tamagui Warning [001]: Skipping loading /t4-app/apps/next/.tamagui/t4ui-components.config.cjs due to error bundling.

Missing theme, an error occurred when importing your config Got config: [Function (anonymous)] { displayName: 'ProxyWorm - Check excludeReactNativeWebExports', _isProxyWorm: true } Looking for theme: displayName

albbus-stack commented 8 months ago

@natew Do you have any clue of what's going on?

natew commented 8 months ago

No idea! Looks like some issues with circular imports maybe.

albbus-stack commented 8 months ago

I added newer react-native deps in #98, now it should work after a bun clean followed by a bun i.

nilesh-auz commented 8 months ago

@albbus-stack I tried but not working. Here is the log:

rn-t4-app git:(feature/first)        bun clean
$ git clean -xdf node_modules && rm bun.lockb
Removing node_modules/
➜  rn-t4-app git:(feature/first) ✗ bun i
[0.10ms] ".env.local"
bun install v1.0.7 (b0393fba)
 + @t4/api@workspace:packages/api
 + @t4/ui@workspace:packages/ui
 + app@workspace:packages/app
 + expo-app@workspace:apps/expo
 + next-app@workspace:apps/next
 + t4-app-docs@workspace:apps/docs
 + @babel/runtime@7.23.2
 + @manypkg/cli@0.21.0
 + @nderscore/tamagui-typescript-plugin@0.6.0
 + @supabase/supabase-js@2.38.4
 + check-dependency-version-consistency@4.1.0
 + cross-env@7.0.3
 + eslint@8.52.0
 + prettier@3.0.3
 + react-native-url-polyfill@2.0.0
 + turbo@1.10.16
 + typescript@5.2.2
 + workerd@1.20231025.0
$ cd packages/ui && tamagui-build
built @t4/ui in 389 ms
$ drizzle-kit generate:sqlite --schema=./src/db/schema.ts --out=./migrations
drizzle-kit: v0.19.13
drizzle-orm: v0.28.6

3 tables
Car 9 columns 0 indexes 0 fks
Test 2 columns 0 indexes 0 fks
User 2 columns 0 indexes 0 fks

No schema changes, nothing to migrate 😴

 2057 packages installed [38.08s]
➜  rn-t4-app git:(feature/first) ✗ bun run web
$ cd apps/next && bun run dev
$ bun with-env next dev
$ dotenv -e ../../.env.local -- next dev
 ○ (pwa) PWA support is disabled.
 ○ (pwa) PWA support is disabled.
  ▲ Next.js 13.5.6
  - Local:        http://localhost:3000
  - Environments: .env
  - Experiments (use at your own risk):
     · scrollRestoration
     · forceSwcTransforms

 ✓ Ready in 9.1s
<w> [webpack.cache.PackFileCacheStrategy/webpack.FileSystemInfo] Resolving 'next/dist/compiled/webpack/webpack-lib' in /rn/rn-t4-app/node_modules/@tamagui/next-plugin/dist/cjs for build dependencies doesn't lead to expected result '/rn/rn-t4-app/node_modules/next/dist/compiled/webpack/webpack-lib.js', but to '/rn/rn-t4-app/node_modules/@tamagui/next-plugin/node_modules/next/dist/compiled/webpack/webpack-lib.js' instead. Resolving dependencies are ignored for this path.
<w>  at unknown 4 next/dist/compiled/webpack/webpack-lib
<w>  at file dependencies /rn/rn-t4-app/node_modules/@tamagui/next-plugin/dist/cjs/withTamagui.js
<w>  at file /rn/rn-t4-app/node_modules/@tamagui/next-plugin/dist/cjs/withTamagui.js
<w>  at file dependencies /rn/rn-t4-app/node_modules/@tamagui/next-plugin/dist/cjs/index.js
<w>  at file /rn/rn-t4-app/node_modules/@tamagui/next-plugin/dist/cjs/index.js
<w>  at file dependencies /rn/rn-t4-app/apps/next/next.config.js
<w>  at file /rn/rn-t4-app/apps/next/next.config.js
<w>  at resolve commonjs /rn/rn-t4-app/apps/next/next.config.js
<w> [webpack.cache.PackFileCacheStrategy/webpack.FileSystemInfo] Resolving 'next/dist/compiled/webpack/webpack-lib' in /rn/rn-t4-app/node_modules/@ducanh2912/next-pwa/dist for build dependencies doesn't lead to expected result '/rn/rn-t4-app/node_modules/next/dist/compiled/webpack/webpack-lib.js', but to '/rn/rn-t4-app/node_modules/@ducanh2912/next-pwa/node_modules/next/dist/compiled/webpack/webpack-lib.js' instead. Resolving dependencies are ignored for this path.
<w>  at unknown 4 next/dist/compiled/webpack/webpack-lib
<w>  at file dependencies /rn/rn-t4-app/node_modules/@ducanh2912/next-pwa/dist/index.cjs
<w>  at file /rn/rn-t4-app/node_modules/@ducanh2912/next-pwa/dist/index.cjs
<w>  at file dependencies /rn/rn-t4-app/apps/next/next.config.js
<w>  at file /rn/rn-t4-app/apps/next/next.config.js
<w>  at resolve commonjs /rn/rn-t4-app/apps/next/next.config.js
 ○ Compiling / ...

    ➡ [tamagui] built config and components (4415ms):

        Config     ./.tamagui/tamagui.config.cjs
        Components ./.tamagui/tamagui-components.config.cjs
             ./.tamagui/t4ui-components.config.cjs

⚠️ Tamagui Warning [001]: Skipping loading /rn/rn-t4-app/apps/next/.tamagui/tamagui.config.cjs due to error bundling.
   - message: Cannot access 'View' before initialization
   - for more info see: https://tamagui.dev/docs/intro/errors#warning-001
   - set TAMAGUI_SHOW_FULL_BUNDLE_ERRORS=1 to see stack trace

⚠️ Tamagui Warning [001]: Skipping loading /rn/rn-t4-app/apps/next/.tamagui/tamagui-components.config.cjs due to error bundling.
   - message: Cannot access 'View' before initialization
   - for more info see: https://tamagui.dev/docs/intro/errors#warning-001
   - set TAMAGUI_SHOW_FULL_BUNDLE_ERRORS=1 to see stack trace

⚠️ Tamagui Warning [001]: Skipping loading /rn/rn-t4-app/apps/next/.tamagui/t4ui-components.config.cjs due to error bundling.
   - message: Cannot access 'View' before initialization
   - for more info see: https://tamagui.dev/docs/intro/errors#warning-001
   - set TAMAGUI_SHOW_FULL_BUNDLE_ERRORS=1 to see stack trace

Missing theme, an error occurred when importing your config
Got config: [Function (anonymous)] {
  displayName: 'ProxyWorm - Check excludeReactNativeWebExports',
  _isProxyWorm: true
}
Looking for theme: displayName
albbus-stack commented 8 months ago

Try with bun clean:workspaces and bun pm cache rm