Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Configure TypeScript for static-site #877

Merged
merged 4 commits into from
May 28, 2024
Merged

Configure TypeScript for static-site #877

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
83ff59e
Copy TSConfig from Auspice
victorlin May 24, 2024
568897d
Make TSConfig work with with Next.js
victorlin May 24, 2024
8d45cc3
Ignore static-site/tsconfig.tsbuildinfo
victorlin May 24, 2024
a7bd07c
Apply TSConfig to files under static-site/pages/
victorlin May 28, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 3 additions & 0 deletions .gitignore
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -50,3 +50,6 @@ terraform.tfstate*
# nextjs
static-site/next-env.d.ts
static-site/.next

# TypeScript
static-site/tsconfig.tsbuildinfo
57 changes: 47 additions & 10 deletions static-site/tsconfig.json
View file
Open in desktop
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Did you find a way to get this working with VS-Code @victorlin?

I can get VS-Code to use the workspace's tsc just fine (v4.9.3) but not to use this config file. According to microsoft/vscode#12463 this is a known bug and won't be fixed.

Specifically, in the current code I get errors in _app.tsx because the default config doesn't use "jsx": "preserve":

image

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

What you saw is because that file wasn't included in the TSConfig:

nextstrain.org/static-site/tsconfig.json

Lines 58 to 61 in 8d45cc3

"include": [
"next-env.d.ts",
"src/**/*",
],

This should be fixed now with a7bd07c – can you try again?

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes - thanks! I was (literally) looking in the wrong place 👍

(VS-Code's TypeScript output logs are pretty sparse, doesn't help debugging much...)

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Which output logs are you referring to? So far I'm using it to look for rule violations (i.e. "problems", red squiggles) which seems sufficient. For example, when enabling noImplicitAny on #874, I can see all the violations in static-site/src/components/ListResources/Modal.tsx.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Oh, I mean the debug/logging output from the typescript checker VS-Code is running itself, which is how I've debugged other things not working (linters, syntax highlighting etc)

image

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Oh gotcha! It looks like that log only contains info on the TS Server process. There is a separate log that you can enable/view using the command TypeScript: Open TS Server log. It's much more verbose (6MB large from just a couple minutes of usage) but not sure if it would've been helpful in this case.

Original file line number Diff line number Diff line change
@@ -1,27 +1,64 @@
/*
This TSConfig file aims to keep as much as possible in sync with the same file
in Auspice¹.

It can't be 100% the same because Next.js requires some configuration options to
be set and will rewrite this file if they aren't set.²

¹ <https://github.com/nextstrain/auspice/blob/-/tsconfig.json>
² https://github.com/vercel/next.js/discussions/39942
*/

{
"compilerOptions": {

/* Modules */
"moduleResolution": "node", /* Specify how TypeScript looks up a file from a given module specifier. */
"types": ["node"], /* Specify type package names to be included without being referenced in a source file. */

/* JavaScript Support */
"allowJs": true, /* Allow JavaScript files to be a part of your program. This allows TS files to import from JS files. */

/* Emit */
"noEmit": true, /* Do not emit compiler output files like JavaScript source code, source-maps or declarations. */

/* Interop Constraints */
"isolatedModules": true, /* Ensure that each file can be safely transpiled without relying on other imports. */
"allowSyntheticDefaultImports": true, /* Allow 'import x from y' when a module doesn't have a default export. */
"forceConsistentCasingInFileNames": true, /* Ensure that casing is correct in imports. */

/* Type Checking */
"strict": true, /* Enable all strict type-checking options. */
"noImplicitAny": false, /* Allow implicit any to make incremental TypeScript adoption easier. */
genehack marked this conversation as resolved.
Show resolved Hide resolved
"noUnusedLocals": true, /* Enable error reporting when a local variables aren't read. */
"noUnusedParameters": true, /* Raise an error when a function parameter isn't read */
"noImplicitReturns": true, /* Enable error reporting for codepaths that do not explicitly return in a function. */
"noFallthroughCasesInSwitch": true, /* Enable error reporting for fallthrough cases in switch statements. */
"noUncheckedIndexedAccess": true, /* Include 'undefined' in index signature results */
"noImplicitOverride": true, /* Ensure overriding members in derived classes are marked with an override modifier. */
"allowUnusedLabels": false, /* Enable error reporting for unused labels. */
"allowUnreachableCode": false, /* Enable error reporting for unreachable code. */
genehack marked this conversation as resolved.
Show resolved Hide resolved

/* Completeness */
"skipDefaultLibCheck": true, /* Skip type checking .d.ts files that are included with TypeScript. */
"skipLibCheck": true, /* Skip type checking all .d.ts files. */

/* Other options required by Next.js */
"jsx": "preserve",
"lib": [
"dom",
"dom.iterable",
"esnext"
],
"allowJs": true,
"skipLibCheck": true,
"strict": false,
"forceConsistentCasingInFileNames": true,
"noEmit": true,
"incremental": true,
"esModuleInterop": true,
"module": "esnext",
"moduleResolution": "node",
"resolveJsonModule": true,
"isolatedModules": true,
"jsx": "preserve"
},
"include": [
"next-env.d.ts",
"**/*.ts",
"**/*.tsx"
"pages/**/*",
"src/**/*",
],
"exclude": [
"node_modules"
Expand Down