Fresh blitz template project fails building because of type error

[espenja]

What is the problem?

Build fails because of type errors immediately after setting up a blitz template with the following settings:

Project Language: TypeScript
App Template: Full - includes DB and auth (Recommended)
Install dependencies?: pnpm
Pick a form library: React Hook Form

Paste all your error logs here:

~\Source\espenja
λ blitz new blitztest
√ Pick a new project's language » TypeScript
√ Pick your new app template » Full - includes DB and auth (Recommended)
√ Install dependencies? » pnpm
√ Pick a form library (you can switch to something else later if you want) » React Hook Form
Hang tight while we set up your new Blitz app!
CREATE    .env
CREATE    .env.local
CREATE    .env.test
CREATE    .eslintrc.js
CREATE    README.md
CREATE    db\index.ts
CREATE    db\migrations\.keep
CREATE    db\schema.prisma
CREATE    db\seeds.ts
CREATE    integrations\.keep
CREATE    mailers\.keep
CREATE    mailers\forgotPasswordMailer.ts
CREATE    next-env.d.ts
CREATE    next.config.js
CREATE    package.json
CREATE    public\favicon.ico
CREATE    public\logo.png
CREATE    src\auth\components\LoginForm.tsx
CREATE    src\auth\components\SignupForm.tsx
CREATE    src\auth\mutations\changePassword.ts
CREATE    src\auth\mutations\forgotPassword.test.ts
CREATE    src\auth\mutations\forgotPassword.ts
CREATE    src\auth\mutations\login.ts
CREATE    src\auth\mutations\logout.ts
CREATE    src\auth\mutations\resetPassword.test.ts
CREATE    src\auth\mutations\resetPassword.ts
CREATE    src\auth\mutations\signup.ts
CREATE    src\auth\schemas.ts
CREATE    src\blitz-client.ts
CREATE    src\blitz-server.ts
CREATE    src\core\components\Form.tsx
CREATE    src\core\components\LabeledTextField.tsx
CREATE    src\core\layouts\Layout.tsx
CREATE    src\pages\404.tsx
CREATE    src\pages\_app.tsx
CREATE    src\pages\_document.tsx
CREATE    src\pages\api\rpc\[[...blitz]].ts
CREATE    src\pages\auth\forgot-password.tsx
CREATE    src\pages\auth\login.tsx
CREATE    src\pages\auth\reset-password.tsx
CREATE    src\pages\auth\signup.tsx
CREATE    src\pages\index.tsx
CREATE    src\styles\Home.module.css
CREATE    src\styles\globals.css
CREATE    src\users\hooks\useCurrentUser.ts
CREATE    src\users\queries\getCurrentUser.ts
CREATE    test\index.test.tsx
CREATE    test\setup.ts
CREATE    test\utils.tsx
CREATE    tsconfig.json
CREATE    types.ts
CREATE    vitest.config.ts

✔ Retrieving the freshest of dependencies
✔ Installing those dependencies (this will take a few minutes)
✔ Formatting your code
✔ Committing your app

 Your new Blitz app is ready! Next steps:
   1. cd blitztest
   2. blitz dev


~\Source\espenja took 1m12s
λ cd .\blitztest\

blitztest on  main via  v20.5.1
λ pnpm build

> blitztest@1.0.0 build <userdirectory>\Source\espenja\blitztest
> blitz build

Loaded env from <userdirectory>\Source\espenja\blitztest\.env.local
Loaded env from <userdirectory>\Source\espenja\blitztest\.env
<userdirectory>\Source\espenja\blitztest\node_modules\.pnpm\next@13.4.5_@babel+core@7.22.10_react-dom@18.2.0_react@18.2.0\node_modules\next\dist\client\index.js
✔ Next.js was successfully patched with a React Suspense fix
✔ Routes manifest was successfully generated
- info Linting and checking validity of types ...Failed to compile.

./src/blitz-server.ts:16:3
Type error: Type 'import("<userdirectory>/Source/espenja/blitztest/node_modules/.pnpm/tslog@4.9.0/node_modules/tslog/dist/types/index").Logger<import("<userdirectory>/Source/espenja/blitztest/node_modules/.pnpm/tslog@4.9.0/node_modules/tslog/dist/types/interfaces").ILogObj>' is not assignable to type 'import("<userdirectory>/Source/espenja/blitztest/node_modules/.pnpm/tslog@4.9.1/node_modules/tslog/dist/types/index").Logger<import("<userdirectory>/Source/espenja/blitztest/node_modules/.pnpm/tslog@4.9.1/node_modules/tslog/dist/types/interfaces").ILogObj>'.
  Types have separate declarations of a private property 'logObj'.

  14 |     }),
  15 |   ],
> 16 |   logger: BlitzLogger({}),
     |   ^
  17 | })
  18 |
 ELIFECYCLE  Command failed with exit code 1.

blitztest on  main [!] via  v20.5.1 took 11s
λ

Paste all relevant code snippets here:

// ./src/blitz-server.ts
import { setupBlitzServer } from "@blitzjs/next"
import { AuthServerPlugin, PrismaStorage } from "@blitzjs/auth"
import { simpleRolesIsAuthorized } from "@blitzjs/auth"
import { BlitzLogger } from "blitz"
import db from "db"
import { authConfig } from "./blitz-client"

export const { gSSP, gSP, api } = setupBlitzServer({
  plugins: [
    AuthServerPlugin({
      ...authConfig,
      storage: PrismaStorage(db),
      isAuthorized: simpleRolesIsAuthorized,
    }),
  ],
  logger: BlitzLogger({}), // <-- type error
})

What are detailed steps to reproduce this?

> blitz new blitztest
√ Pick a new project's language » TypeScript
√ Pick your new app template » Full - includes DB and auth (Recommended)
√ Install dependencies? » pnpm
√ Pick a form library (you can switch to something else later if you want) » React Hook Form

> pnpm build

Run blitz -v and paste the output here:

Blitz version: 2.0.0-beta.32 (global)
Blitz version: 2.0.0-beta.32 (local)
Windows 11 | win32-x64 | Node: v20.5.1


 Package manager: pnpm

  System:
    OS: Windows 10 10.0.22621
    CPU: (16) x64 Intel(R) Core(TM) i9-9980HK CPU @ 2.40GHz
    Memory: 16.22 GB / 31.70 GB
  Binaries:
    Node: 20.5.1 - ~\AppData\Local\pnpm\node.EXE
    Yarn: 1.22.19 - C:\Program Files (x86)\Yarn\bin\yarn.CMD
    npm: 9.8.0 - ~\AppData\Local\pnpm\npm.CMD
  npmPackages:
    @blitzjs/auth: 2.0.0-beta.32 => 2.0.0-beta.32 
    @blitzjs/next: 2.0.0-beta.32 => 2.0.0-beta.32 
    @blitzjs/rpc: 2.0.0-beta.32 => 2.0.0-beta.32 
    @prisma/client: 4.6.1 => 4.6.1 
    blitz: 2.0.0-beta.32 => 2.0.0-beta.32 
    next: 13.4.5 => 13.4.5 
    prisma: 4.6.1 => 4.6.1 
    react: 18.2.0 => 18.2.0 
    react-dom: 18.2.0 => 18.2.0 
    typescript: ^4.8.4 => 4.8.4 

Please include below any other applicable logs and screenshots that show your problem:

[25toma]

Likewise, it's probable that an error has occurred due to tslog. I'll describe the error in detail below.

What is the problem?

When attempting to log in with an incorrect password, a "Bad Request" error message appears.

Project Language: TypeScript
App Template: Full - includes DB and auth (Recommended)
Install dependencies?: yarn
Pick a form library: React Final Form (recommended)

Paste all your error logs here:

2023-08-21 09:36:37.757    INFO    [blitz-rpc]    getCurrentUser() Starting with input: null
2023-08-21 09:36:37.757    DEBUG    [blitz-rpc]    getCurrentUser() Result: null
2023-08-21 09:36:37.757    DEBUG    [blitz-rpc]    getCurrentUser() Next.js serialization:0ms
2023-08-21 09:36:37.758    INFO    [blitz-rpc]    getCurrentUser() Finished: resolver:0ms serializer:1ms total:1ms
2023-08-21 09:36:42.726    INFO    [blitz-rpc]    login() Starting with input: {
  email: 'example@example.com',
  password: '[***]'
}
[AuthenticationError: You must be logged in to access this] {
  statusCode: 401
}


Error while processing the request
TypeError: Cannot read properties of undefined (reading 'map')
    at prettyFormatErrorObj (/Users/example/Desktop/myAppName/node_modules/tslog/dist/cjs/runtime/nodejs/index.js:95:47)
    at maskedArgs.reduce.args (/Users/example/Desktop/myAppName/node_modules/tslog/dist/cjs/runtime/nodejs/index.js:89:43)
    at Array.reduce (<anonymous>)
    at Object.prettyFormatLogObj (/Users/example/Desktop/myAppName/node_modules/tslog/dist/cjs/runtime/nodejs/index.js:88:23)
    at Logger.log (/Users/example/Desktop/myAppName/node_modules/tslog/dist/cjs/BaseLogger.js:111:77)
    at Logger.error (/Users/example/Desktop/myAppName/node_modules/tslog/dist/cjs/index.js:51:22)
    at /Users/example/Desktop/myAppName/node_modules/@blitzjs/rpc/dist/index-server.cjs:326:15
    at Generator.throw (<anonymous>)
    at rejected (/Users/example/myAppName/node_modules/@blitzjs/rpc/dist/index-server.cjs:127:29)

Paste all relevant code snippets here:

  <Form
        submitText="Login"
        schema={Login}
        initialValues={{ email: "", password: "" }}
        onSubmit={async (values) => {
          try {
            const user = await loginMutation(values)
            props.onSuccess?.(user)
          } catch (error: any) {
            if (error instanceof AuthenticationError) {
              return { [FORM_ERROR]: "Sorry, those credentials are invalid" }
            } else {
              return {
                [FORM_ERROR]:
                  "Sorry, we had an unexpected error. Please try again. - " + error.toString(),
              }
            }
          }
        }}
      >

What are detailed steps to reproduce this?

1. blitz new myAppName with the following options:
   Pick a new project's language › TypeScript
   Pick your new app template › Full - includes DB and auth (Recommended)
   Install dependencies? › yarn
   Pick a form library (you can switch to something else later if you want) > Select React Final Form (recommended)
2. cd myAppName
3. yarn blitz dev
4. Create a new account
5. Log out of the account
6. Attempt to log in with an incorrect password

Run blitz -v and paste the output here:

Blitz version: 2.0.0-beta.32 (local)
macOS Ventura | darwin-arm64 | Node: v20.4.0


 Package manager: npm

  System:
    OS: macOS 13.4.1
    CPU: (8) arm64 Apple M1
    Memory: 649.81 MB / 16.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 20.4.0 - /var/folders/4g/cxm9ykgj3233ntyv30k5db2c0000gn/T/yarn--1692579171845-0.5899365927776306/node
    Yarn: 1.22.19 - /var/folders/4g/cxm9ykgj3233ntyv30k5db2c0000gn/T/yarn--1692579171845-0.5899365927776306/yarn
    npm: 9.7.2 - ~/.asdf/plugins/nodejs/shims/npm
  npmPackages:
    @blitzjs/auth: 2.0.0-beta.32 => 2.0.0-beta.32
    @blitzjs/next: 2.0.0-beta.32 => 2.0.0-beta.32
    @blitzjs/rpc: 2.0.0-beta.32 => 2.0.0-beta.32
    @prisma/client: 4.6.1 => 4.6.1
    blitz: 2.0.0-beta.32 => 2.0.0-beta.32
    next: 13.4.5 => 13.4.5
    prisma: 4.6.1 => 4.6.1
    react: 18.2.0 => 18.2.0
    react-dom: 18.2.0 => 18.2.0
    typescript: ^4.8.4 => 4.9.5

Please include below any other applicable logs and screenshots that show your problem:

[gengjiawen]

@justinsmid Can you take a look at this ? thx

[justinsmid]

Seems like setupBlitzServer expects logger to be a tslog Logger object of tslog version 4.9.2, but BlitzLogger returns one of version 4.9.0.

I do not know why the "blitz" (which exports BlitzLogger) and "@blitzjs/next" (which exports setupBlitzServer) packages seemingly use different tslog versions.

If I had to guess why, from a quick glance, I would suspect this "*" version used here by blitz-next is causing it to use the latest version where blitz's package.json has its tslog version hard-set at 4.9.0, but I am not sure, and don't actually know anything about blitz's code itself and/or why this is the case.

[siddhsuresh]

thanks for the issue @espenja and your suggestion @justinsmid taking a look now.