Typescript check fails when 'strict' is enabled in the project (v1.0.1)

[pataar]

Summary

I have a project that contains a minimal tsconfig.json with 'strict' enabled.

{
	"extends": "expo/tsconfig.base",
	"compilerOptions": {
		"strict": true
	}
}

This currently gives errors like this:

Feels weird to me that libraries are included in type checks. Is that correct?

Minimal reproducible example

Just set your ts compiler to 'strict'. Like this:

{
	"extends": "expo/tsconfig.base",
	"compilerOptions": {
		"strict": true
	}
}

[DevYuns]

I also faced similar issue when running npx tsc.

❯ yarn tsc
node_modules/expo-router/src/fork/getPathFromState.ts:529:14 - error TS7053: Element implicitly has an 'any' type because expression of type 'string' can't be used to index type '{}'.
  No index signature with a parameter of type 'string' was found on type '{}'.

529       delete processedParams[name];
                 ~~~~~~~~~~~~~~~~~~~~~

node_modules/expo-router/src/fork/getPathFromState.ts:536:12 - error TS7053: Element implicitly has an 'any' type because expression of type 'string' can't be used to index type '{}'.
  No index signature with a parameter of type 'string' was found on type '{}'.

536     delete processedParams[name];
               ~~~~~~~~~~~~~~~~~~~~~

node_modules/expo-router/src/fork/getStateFromPath.ts:11:20 - error TS7016: Could not find a declaration file for module 'escape-string-regexp'. '/Users/dean/Documents/workspace/dooboolab/expo-router-boilerplate/node_modules/escape-string-regexp/index.js' implicitly has an 'any' type.
  Try `npm i --save-dev @types/escape-string-regexp` if it exists or add a new declaration (.d.ts) file containing `declare module 'escape-string-regexp';`

11 import escape from "escape-string-regexp";
                      ~~~~~~~~~~~~~~~~~~~~~~

node_modules/expo-router/src/fork/getStateFromPath.ts:475:18 - error TS7053: Element implicitly has an 'any' type because expression of type 'string' can't be used to index type '{}'.
  No index signature with a parameter of type 'string' was found on type '{}'.

475   const config = routeConfig[screen];
                     ~~~~~~~~~~~~~~~~~~~

node_modules/expo-router/src/link/linking.ts:85:39 - error TS2339: Property 'removeEventListener' does not exist on type 'typeof import("/Users/dean/Documents/workspace/dooboolab/expo-router-boilerplate/node_modules/expo-linking/build/Linking")'.

85   const removeEventListener = Linking.removeEventListener?.bind(Linking);
                                         ~~~~~~~~~~~~~~~~~~~

node_modules/expo-router/src/link/path.ts:24:21 - error TS7006: Parameter 'path' implicitly has an 'any' type.

24 function assertPath(path) {
                       ~~~~

node_modules/expo-router/src/link/path.ts:33:31 - error TS7006: Parameter 'path' implicitly has an 'any' type.

33 function normalizeStringPosix(path, allowAboveRoot) {
                                 ~~~~

node_modules/expo-router/src/link/path.ts:33:37 - error TS7006: Parameter 'allowAboveRoot' implicitly has an 'any' type.

33 function normalizeStringPosix(path, allowAboveRoot) {
                                       ~~~~~~~~~~~~~~

node_modules/expo-router/src/link/path.ts:101:25 - error TS7019: Rest parameter 'segments' implicitly has an 'any[]' type.

101 export function resolve(...segments) {
                            ~~~~~~~~~~~

node_modules/expo-router/src/link/stateOperations.ts:32:11 - error TS7022: 'nextRoute' implicitly has type 'any' because it does not have a type annotation and is referenced directly or indirectly in its own initializer.

32     const nextRoute = current?.routes?.[current?.routes?.length - 1];
             ~~~~~~~~~

node_modules/expo-router/src/link/stateOperations.ts:70:11 - error TS7022: 'nextRoute' implicitly has type 'any' because it does not have a type annotation and is referenced directly or indirectly in its own initializer.

70     const nextRoute = current?.routes?.[current?.routes?.length - 1];
             ~~~~~~~~~

node_modules/expo-router/src/link/stateOperations.ts:72:11 - error TS7022: 'nextCurrentRoot' implicitly has type 'any' because it does not have a type annotation and is referenced directly or indirectly in its own initializer.

72     const nextCurrentRoot = currentRoot?.routes?.find(
             ~~~~~~~~~~~~~~~

node_modules/expo-router/src/LocationProvider.tsx:57:46 - error TS7015: Element implicitly has an 'any' type because index expression is not of type 'number'.

57       return aKeys.every((paramKey) => aKeys[paramKey] === bKeys[paramKey]);
                                                ~~~~~~~~

node_modules/expo-router/src/LocationProvider.tsx:57:66 - error TS7015: Element implicitly has an 'any' type because index expression is not of type 'number'.

57       return aKeys.every((paramKey) => aKeys[paramKey] === bKeys[paramKey]);
                                                                    ~~~~~~~~

node_modules/expo-router/src/LocationProvider.tsx:163:9 - error TS7053: Element implicitly has an 'any' type because expression of type 'string' can't be used to index type '{}'.
  No index signature with a parameter of type 'string' was found on type '{}'.

163         prev[key] = value.map(decodeURIComponent);
            ~~~~~~~~~

node_modules/expo-router/src/LocationProvider.tsx:165:9 - error TS7053: Element implicitly has an 'any' type because expression of type 'string' can't be used to index type '{}'.
  No index signature with a parameter of type 'string' was found on type '{}'.

165         prev[key] = decodeURIComponent(value as string);
            ~~~~~~~~~

node_modules/expo-router/src/static/useServerState.ts:2:27 - error TS7016: Could not find a declaration file for module '@react-navigation/native/lib/module/ServerContext'. '/Users/dean/Documents/workspace/dooboolab/expo-router-boilerplate/node_modules/@react-navigation/native/lib/module/ServerContext.js' implicitly has an 'any' type.
  If the '@react-navigation/native' package actually exposes this module, try adding a new declaration (.d.ts) file containing `declare module '@react-navigation/native/lib/module/ServerContext';`

2 import ServerContext from "@react-navigation/native/lib/module/ServerContext";
                            ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

node_modules/expo-router/src/useScreens.tsx:168:13 - error TS7031: Binding element 'params' implicitly has an 'any' type.

168   return ({ params }) => {
                ~~~~~~

node_modules/expo-router/src/views/Navigator.tsx:115:38 - error TS7006: Parameter 'route' implicitly has an 'any' type.

115   const current = state.routes.find((route, i) => {
                                         ~~~~~

node_modules/expo-router/src/views/Navigator.tsx:115:45 - error TS7006: Parameter 'i' implicitly has an 'any' type.

115   const current = state.routes.find((route, i) => {
                                                ~


Found 20 errors in 9 files.

Errors  Files
     2  node_modules/expo-router/src/fork/getPathFromState.ts:529
     2  node_modules/expo-router/src/fork/getStateFromPath.ts:11
     1  node_modules/expo-router/src/link/linking.ts:85
     4  node_modules/expo-router/src/link/path.ts:24
     3  node_modules/expo-router/src/link/stateOperations.ts:32
     4  node_modules/expo-router/src/LocationProvider.tsx:57
     1  node_modules/expo-router/src/static/useServerState.ts:2
     1  node_modules/expo-router/src/useScreens.tsx:168
     2  node_modules/expo-router/src/views/Navigator.tsx:115

My tsconfig.json file is here.

{
  "extends": "expo/tsconfig.base",
  "jsx": "react-jsx",
  "include": [
    "app/**/*.ts",
    "app/**/*.tsx",
    "src/**/*.ts",
    "src/**/*.tsx",
    "**/*.test.tsx",
    "**/*.spec.ts"
  ],
  "exclude": ["node_modules"],
  "jest": {
    "globals": {
      "ts-jest": {
        "skipBabel": true
      }
    }
  },
  "compilerOptions": {
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    "experimentalDecorators": true,
    "emitDecoratorMetadata": true,
    "jsx": "react-jsx",
    "lib": ["es2017", "dom"],
    "module": "es2015",
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "noEmit": true,
    "noUnusedLocals": false,
    "skipLibCheck": true,
    "sourceMap": true,
    "strict": true,
    "target": "es2020",
    "typeRoots": [
      "expo-router/ts-declarations",
      "./@types",
      "./node_modules/@types"
    ],
    "plugins": [
      {
        "name": "typescript-styled-plugin",
        "lint": {
          "validProperties": [
            "shadow-color",
            "shadow-opacity",
            "shadow-offset",
            "shadow-radius",
            "spread-radius",
            "padding-horizontal",
            "padding-vertical",
            "margin-vertical",
            "margin-horizontal",
            "tint-color",
            "aspect-ratio",
            "elevation",
            "blur-radius"
          ]
        }
      }
    ]
  },
  "files": ["environment.d.ts"]
}

[pataar]

Sorry @EvanBacon, but it's still giving some errors:

Text version

node_modules/expo-router/src/fork/getPathFromState.ts:421:35 - error TS2339: Property 'stringify' does not exist on type 'typeof import("/Users/pieter/projects/phoenix/node_modules/query-string/index")'.

421         const query = queryString.stringify(focusedParams, { sort: false });
                                      ~~~~~~~~~

node_modules/expo-router/src/fork/getStateFromPath.ts:11:20 - error TS7016: Could not find a declaration file for module 'escape-string-regexp'. '/Users/pieter/projects/phoenix/node_modules/escape-string-regexp/index.js' implicitly has an 'any' type.
  Try `npm i --save-dev @types/escape-string-regexp` if it exists or add a new declaration (.d.ts) file containing `declare module 'escape-string-regexp';`

11 import escape from "escape-string-regexp";
                      ~~~~~~~~~~~~~~~~~~~~~~

node_modules/expo-router/src/fork/getStateFromPath.ts:723:30 - error TS2339: Property 'parse' does not exist on type 'typeof import("/Users/pieter/projects/phoenix/node_modules/query-string/index")'.

723   const params = queryString.parse(query);
                                 ~~~~~

[erisvaldojunior]

+1

[erisvaldojunior]

Seems like it is still happening on 1.2.2

[marklawlor]

@erisvaldojunior Can you please share reproduction repo? The problem is most likely caused by a clash between your dependencies, so we'll need a full reproduction.

[kevin-ashton]

I'm running into an issue that perhaps is related. I run tsc as part of my pre-commit hook. I like to make sure all my typescript is valid before committing it. Anyway I get errors from expo-router.

As far as I can tell its because expo-router doesn't actually reference types but the source code.

This is a known issue with libraries that don't reference index.d.ts. See microsoft/TypeScript#41883 and https://github.com/Notalifeform/node-find-free-ports/pull/1/files .

If I understand things correctly even though expo has skipLibCheck to to true, it doesn't apply because the types reference actual source code not a d.ts file.

At the end of the day lots of libraries aren't going to pass the strict test, but it doesn't matter because they specify index.d.ts for their types. Anyway not sure if this is the issue but seems like it might be related. I'm hoping it is because I don't want to open another issue if they are the same root problem.

[pataar]

I think @kevin-ashton has a point. It feels weird that your project's tsconfig applies to libraries. I think by simply generating declarations and pointing the package.json to it, skipLibCheck would ignore the config difference.

[erisvaldojunior]

Just adding as a side note: it was not happening on 1.0.0-rc7, only after upgrading I got these typescript issues. We also run tsc as part of our pre-commit hook and then it fails on the new router version (errors above mentioned by @kevin-ashton). It fails even with strict: false.