Wasp•3w ago

update to 0.17.1 with already TS migrated project

If I have already converted over to the main.wasp.ts, what are the steps needed to migrate to 0.17.1? I've been able to follow everything except #2 and #3, https://wasp.sh/docs/migration-guides/migrate-from-0-16-to-0-17#2-update-your-tsconfigjson https://wasp.sh/docs/migration-guides/migrate-from-0-16-to-0-17#3-tell-wasp-about-jest-dom-types I also never had express installed on my dependencies. Should it be installed for 0.17? "express": "~5.1.0" Also, the only api endpoint that may be affected for me is the paymentsWebhook, as it came with the SasS template. I'm not sure what would need to be changed though.

Migration from 0.16.X to 0.17.X | Wasp

What's new in 0.17.0?

18 Replies

kapa.ai•3w ago

Hi @hadanator. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave: ---------------------- I'm sorry, but the knowledge sources provided do not contain information about migrating a Wasp project to version 0.17.1, updating your tsconfig.json for 0.17.x, handling jest-dom types, or whether you need to add express as a dependency for 0.17.x. The sources also do not include details about changes required for API endpoints like paymentsWebhook in the context of the SaaS template for this version. If you need guidance for migration steps specific to 0.17.1, I recommend checking the official Wasp migration guides or the Wasp Discord server for up-to-date support. If you have questions about previous migrations (e.g., 0.11.x to 0.12.x), I can provide detailed steps from the sources above. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ---------------------- Sorry @hadanator, I seem to be having a bit of trouble. Don't worry though, I've pinged my support and they will try to fix me up! :technologist: Perhaps try again in 15mins?

toticozeni•3w ago

Hey @hadanator, you leave a great point that we don't provide how to migrate versions with Wasp TS Config. I'll see if this is something we need to implement. Could you point out what version are you starting from? Something 0.16.X or? If you didn't have express installed previously, there is no need to to add anything. If you're already using the SaaS template, the easiest way to update is to look at the latest version of template and to copy the diffrences you need. If you use Stripe you can find it here: https://github.com/wasp-lang/open-saas/blob/main/template/app/src/payment/stripe/webhook.ts If you still have any questions feel free to ping me.

GitHub

open-saas/template/app/src/payment/stripe/webhook.ts at main · was...

A free, open-source SaaS app starter for React & Node.js with superpowers. Full-featured. Community-driven. - wasp-lang/open-saas

hadanatorOP•2w ago

@franjo yeah I'm coming from 0.16.5. And when I install 17.1 on my system, I do a wasp clean, and wasp ts-setup and install node modules, and finally wasp build, and I get these errors:

- Wasp requires package "typescript" to be version "5.8.2" in package.json.
- The "compilerOptions.moduleDetection" field is missing in TS config, you must set it to: "force".
- The "compilerOptions.isolatedModules" field is missing in TS config, you must set it to: true.

- Wasp requires package "typescript" to be version "5.8.2" in package.json.
- The "compilerOptions.moduleDetection" field is missing in TS config, you must set it to: "force".
- The "compilerOptions.isolatedModules" field is missing in TS config, you must set it to: true.

Typescript is set to 5.8.2 in the dev deps, and this is my tsconfig.wasp.json:

{
  "compilerOptions": {
    "skipLibCheck": true,
    "target": "ES2022",
    "isolatedModules": true,
    "moduleDetection": "force",

    // linting
    "strict": true,
    "noUnusedLocals": true,
    "noUnusedParameters": true,

    "module": "NodeNext",
    "noEmit": true,

    "lib": ["ES2023"]
  },
  "include": ["main.wasp.ts"]
}

{
  "compilerOptions": {
    "skipLibCheck": true,
    "target": "ES2022",
    "isolatedModules": true,
    "moduleDetection": "force",

    // linting
    "strict": true,
    "noUnusedLocals": true,
    "noUnusedParameters": true,

    "module": "NodeNext",
    "noEmit": true,

    "lib": ["ES2023"]
  },
  "include": ["main.wasp.ts"]
}

which has the two flags from the errors present. So I'm not quite sure what's going on there. Should the "module" be changed to esnext or something else? If I do 'esnext', I get this:

[  Wasp  ] main.wasp.ts(1,21): error TS2792: Cannot find module 'wasp-config'. Did you mean to set the 'moduleResolution' option to 'nodenext', or to add aliases to the 'paths' option?

toticozeni•2w ago

This is incorrect per migration guide: https://wasp.sh/docs/migration-guides/migrate-from-0-16-to-0-17#2-update-your-tsconfigjson Your tsconfig.js should be:

{
  "compilerOptions": {
    "module": "esnext",
    "composite": true,
    "target": "esnext",
    "moduleResolution": "bundler",
    "jsx": "preserve",
    "strict": true,
    "esModuleInterop": true,
    "isolatedModules": true,
    "moduleDetection": "force",
    "lib": ["dom", "dom.iterable", "esnext"],
    "skipLibCheck": true,
    "allowJs": true,
    "outDir": ".wasp/out/user"
  },
  "include": ["src"]
}

{
  "compilerOptions": {
    "module": "esnext",
    "composite": true,
    "target": "esnext",
    "moduleResolution": "bundler",
    "jsx": "preserve",
    "strict": true,
    "esModuleInterop": true,
    "isolatedModules": true,
    "moduleDetection": "force",
    "lib": ["dom", "dom.iterable", "esnext"],
    "skipLibCheck": true,
    "allowJs": true,
    "outDir": ".wasp/out/user"
  },
  "include": ["src"]
}

This is refereing to the tsconfig.json in the root of your project. So my-project/tsconfig.json And example of minimal package.json for Wasp TS config would be:

{
  "name": "ts",
  "type": "module",
  "dependencies": {
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "react-router-dom": "^6.26.2",
    "wasp": "file:.wasp/out/sdk/wasp"
  },
  "devDependencies": {
    "@types/react": "^18.0.37",
    "prisma": "5.19.1",
    "typescript": "5.8.2",
    "vite": "^4.3.9",
    // don't copy the value of `wasp-config`
    // since that depends on the evnrionment
    // instead let the `wasp ts-setup` configure it 
    "wasp-config": "file:../../../../../.local/share/wasp-lang/0.17.1/data/packages/wasp-config"
  }
}

{
  "name": "ts",
  "type": "module",
  "dependencies": {
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "react-router-dom": "^6.26.2",
    "wasp": "file:.wasp/out/sdk/wasp"
  },
  "devDependencies": {
    "@types/react": "^18.0.37",
    "prisma": "5.19.1",
    "typescript": "5.8.2",
    "vite": "^4.3.9",
    // don't copy the value of `wasp-config`
    // since that depends on the evnrionment
    // instead let the `wasp ts-setup` configure it 
    "wasp-config": "file:../../../../../.local/share/wasp-lang/0.17.1/data/packages/wasp-config"
  }
}

hadanatorOP•2w ago

Well, my tsonfig.json is

{
  "files": [],
  "references": [
    { "path": "./tsconfig.src.json" },
    { "path": "./tsconfig.wasp.json" }
  ]
}

{
  "files": [],
  "references": [
    { "path": "./tsconfig.src.json" },
    { "path": "./tsconfig.wasp.json" }
  ]
}

So should that one you referenced be replicated in the src.json or the wasp.json? Or both?

toticozeni•2w ago

Where do you find this tsconfig.json? You shouldn't change anything inside of .wasp folder, but rather in your project itself. Change the tsconfig.json which is next to main.wasp.ts. @hadanator

hadanatorOP•2w ago

This is my folder structure. The instructions to convert to the ts version of main.wasp say to have two tsconfig files: https://wasp.sh/docs/general/wasp-ts-config

Wasp TypeScript config (*.wasp.ts) | Wasp

This document assumes your app works with Wasp >= 0.16.3.\

toticozeni•2w ago

Hm. Don't know how you end up with multiple tsconfig.json files. Do you remember? Usually we only have a single one. Could you also show me contents of tsconfig.src.json. Before 0.17.X we had following tsconfig.json:

{
  "compilerOptions": {
    "module": "esnext",
    // Needed because this is used as a project reference.
    "composite": true,
    "target": "esnext",
    // We're bundling all code in the end so this is the most appropriate option,
    // it's also important for autocomplete to work properly.
    "moduleResolution": "bundler",
    // JSX support
    "jsx": "preserve",
    "strict": true,
    // Allow default imports.
    "esModuleInterop": true,
    "lib": ["dom", "dom.iterable", "esnext"],
    "skipLibCheck": true,
    "allowJs": true,
    "typeRoots": [
      // This is needed to properly support Vitest testing with jest-dom matchers.
      // Types for jest-dom are not recognized automatically and Typescript complains
      // about missing types e.g. when using `toBeInTheDocument` and other matchers.
      "node_modules/@testing-library",
      // Specifying type roots overrides the default behavior of looking at the
      // node_modules/@types folder so we had to list it explicitly.
      // Source 1: https://www.typescriptlang.org/tsconfig#typeRoots
      // Source 2: https://github.com/testing-library/jest-dom/issues/546#issuecomment-1889884843
      "node_modules/@types"
    ],
    "outDir": ".wasp/out/user"
  },
  "include": ["src"]
}

{
  "compilerOptions": {
    "module": "esnext",
    // Needed because this is used as a project reference.
    "composite": true,
    "target": "esnext",
    // We're bundling all code in the end so this is the most appropriate option,
    // it's also important for autocomplete to work properly.
    "moduleResolution": "bundler",
    // JSX support
    "jsx": "preserve",
    "strict": true,
    // Allow default imports.
    "esModuleInterop": true,
    "lib": ["dom", "dom.iterable", "esnext"],
    "skipLibCheck": true,
    "allowJs": true,
    "typeRoots": [
      // This is needed to properly support Vitest testing with jest-dom matchers.
      // Types for jest-dom are not recognized automatically and Typescript complains
      // about missing types e.g. when using `toBeInTheDocument` and other matchers.
      "node_modules/@testing-library",
      // Specifying type roots overrides the default behavior of looking at the
      // node_modules/@types folder so we had to list it explicitly.
      // Source 1: https://www.typescriptlang.org/tsconfig#typeRoots
      // Source 2: https://github.com/testing-library/jest-dom/issues/546#issuecomment-1889884843
      "node_modules/@types"
    ],
    "outDir": ".wasp/out/user"
  },
  "include": ["src"]
}

Now on 0.17.X it should be:

{
  "compilerOptions": {
    "module": "esnext",
    "composite": true,
    "target": "esnext",
    "moduleResolution": "bundler",
    "jsx": "preserve",
    "strict": true,
    "esModuleInterop": true,
    "isolatedModules": true,
    "moduleDetection": "force",
    "lib": ["dom", "dom.iterable", "esnext"],
    "skipLibCheck": true,
    "allowJs": true,
    "outDir": ".wasp/out/user"
  },
  "include": ["src"]
}

{
  "compilerOptions": {
    "module": "esnext",
    "composite": true,
    "target": "esnext",
    "moduleResolution": "bundler",
    "jsx": "preserve",
    "strict": true,
    "esModuleInterop": true,
    "isolatedModules": true,
    "moduleDetection": "force",
    "lib": ["dom", "dom.iterable", "esnext"],
    "skipLibCheck": true,
    "allowJs": true,
    "outDir": ".wasp/out/user"
  },
  "include": ["src"]
}

hadanatorOP•2w ago

Yeah, the link I just posted.

toticozeni•2w ago

Oh, my bad now I understand. Forgot about that step. Then change the tsconfig.src.json. We create the other tsconfig.wasp.json so main.wasp.ts has proper Typescript support. So to conclude: tsconfig.src.json should be:

{
  "compilerOptions": {
    "module": "esnext",
    "composite": true,
    "target": "esnext",
    "moduleResolution": "bundler",
    "jsx": "preserve",
    "strict": true,
    "esModuleInterop": true,
    "isolatedModules": true,
    "moduleDetection": "force",
    "lib": ["dom", "dom.iterable", "esnext"],
    "skipLibCheck": true,
    "allowJs": true,
    "outDir": ".wasp/out/user"
  },
  "include": ["src"]
}

{
  "compilerOptions": {
    "module": "esnext",
    "composite": true,
    "target": "esnext",
    "moduleResolution": "bundler",
    "jsx": "preserve",
    "strict": true,
    "esModuleInterop": true,
    "isolatedModules": true,
    "moduleDetection": "force",
    "lib": ["dom", "dom.iterable", "esnext"],
    "skipLibCheck": true,
    "allowJs": true,
    "outDir": ".wasp/out/user"
  },
  "include": ["src"]
}

hadanatorOP•2w ago

Oh ok cool, I'll give that a shot. So this tsconfig.wasp.json is fine?

{
  "compilerOptions": {
    "skipLibCheck": true,
    "target": "ES2022",
    "isolatedModules": true,
    "moduleDetection": "force",

    // linting
    "strict": true,
    "noUnusedLocals": true,
    "noUnusedParameters": true,

    "module": "NodeNext",
    "noEmit": true,

    "lib": ["ES2023"]
  },
  "include": ["main.wasp.ts"]
}

{
  "compilerOptions": {
    "skipLibCheck": true,
    "target": "ES2022",
    "isolatedModules": true,
    "moduleDetection": "force",

    // linting
    "strict": true,
    "noUnusedLocals": true,
    "noUnusedParameters": true,

    "module": "NodeNext",
    "noEmit": true,

    "lib": ["ES2023"]
  },
  "include": ["main.wasp.ts"]
}

toticozeni•2w ago

Yes. We didn't change that one AFAIK. This one really only affects main.wasp.ts.

hadanatorOP•2w ago

Ok awesome thanks!

hadanatorOP•2w ago

Hmm, well upon building (wasp build), i get this error: --- Building wasp project... --------------------------------------------------- ❌ --- [Error] Your wasp project failed to compile: ------------------------------- - Wasp requires package "typescript" to be version "5.8.2" in package.json. ❌ --- [Error] Building of wasp project failed: ----------------------------------- 1 errors found. But I already have typescript set to that version. Does it need to be in dependencies, instead of devDeps?

toticozeni•2w ago

No, that is fine. The problem is we need the explicit version: 5.8.2 , not ^5.8.2 We had to hardcode that version for now.

hadanatorOP•2w ago

Ah ok I'll try that real quick. Ok, that seems to work now. Thanks for your help!

toticozeni•2w ago

No problem, sorry for the confusion. Really forgot we generate additional tsconfig files in the guide 😅 .

hadanatorOP•2w ago

Oh yeah no big deal. It's a lot of moving parts haha.

Gaming

Programming

update to 0.17.1 with already TS migrated project

Did you find this page helpful?