RN: Unable to resolve index file

[jaydenseric]

RN: Unable to resolve index file

[jaydenseric]

Maybe you need to update to a modern version of TypeScript that is capable of resolving .mjs modules correctly. See TS config compilerOptions.module value nodenext:

https://www.typescriptlang.org/tsconfig#node12nodenext-nightly-builds

[jaydenseric]

Ok, so I just learned something about TypeScript config after running into a similar weird problem in a project about certain module types being missing, even though it didn't make sense because the module was definitely there and the types can't be missing because they are inside the module as TypeScript JSDoc comments.

The fix was to set compilerOptions.maxNodeModuleJsDepth to something higher than the 0 default, i.e. 10. Otherwise TypeScript bails from type checking dependencies of dependencies, and instead of giving a relevant error it just spews an error beginning with TS7016: Could not find a declaration file for module .

Here is the jsconfig.json I'm using in projects now:

{
  "compilerOptions": {
    "maxNodeModuleJsDepth": 10,
    "module": "nodenext",
    "noEmit": true,
    "strict": true
  },
  "typeAcquisition": {
    "enable": false
  }
}

[giautm]

I found the commit related, f34e4b0 and 23fa494

[giautm]

I fixed by update the import statement:

- import extractFiles from 'extract-files'
+ import extractFiles from 'extract-files/extractFiles.mjs'

And declare ts module for it:

declare module 'extract-files/extractFiles.mjs' {
  export default function extractFiles<T>(
    values: any,
    isExtractableFile?: (value: T) => boolean,
    path: string = '',
  )
}

also, require the custom File:

export class ReactNativeFile {
  readonly uri: string
  readonly name: string
  readonly type: string
  constructor({ uri, name, type }) {
    this.uri = uri
    this.name = name
    this.type = type
  }
}

const { clone, files } = extractFiles<ReactNativeFile>(
  {
    query: req.operation.text,
    variables: req.variables,
  },
  (file) => file instanceof ReactNativeFile,
)

[jaydenseric]

Glad you figured it out :)

And declare ts module for it

This should not be necessary, because the module has built in TypeScript types via JSDoc:

extract-files/extractFiles.mjs

Lines 8 to 61 in 5232ae9

	/**
	* Recursively extracts files and their {@link ObjectPath object paths} within a
	* value, replacing them with `null` in a deep clone without mutating the
	* original value.
	* [`FileList`](https://developer.mozilla.org/en-US/docs/Web/API/Filelist)
	* instances are treated as
	* [`File`](https://developer.mozilla.org/en-US/docs/Web/API/File) instance
	* arrays.
	* @template Extractable Extractable file type.
	* @param {unknown} value Value to extract files from. Typically an object tree.
	* @param {(value: unknown) => value is Extractable} isExtractable Matches extractable files. Typically
	* {@linkcode isExtractableFile}.
	* @param {ObjectPath} [path] Prefix for object paths for extracted files.
	* Defaults to `""`.
	* @returns {Extraction<Extractable>} Extraction result.
	* @example
	* Extracting files from an object.
	*
	* For the following:
	*
	* ```js
	* import extractFiles from "extract-files/extractFiles.mjs";
	* import isExtractableFile from "extract-files/isExtractableFile.mjs";
	*
	* const file1 = new File(["1"], "1.txt", { type: "text/plain" });
	* const file2 = new File(["2"], "2.txt", { type: "text/plain" });
	* const value = {
	* a: file1,
	* b: [file1, file2],
	* };
	*
	* const { clone, files } = extractFiles(value, isExtractableFile, "prefix");
	* ```
	*
	* `value` remains the same.
	*
	* `clone` is:
	*
	* ```json
	* {
	* "a": null,
	* "b": [null, null]
	* }
	* ```
	*
	* `files` is a
	* [`Map`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map)
	* instance containing:
	*
	* | Key | Value |
	* | :------ | :--------------------------- |
	* | `file1` | `["prefix.a", "prefix.b.0"]` |
	* | `file2` | `["prefix.b.1"]` |
	*/

[giautm]

The TS compile in my project still complain about missing module. T_T

[giautm]

Maybe you need to update to a modern version of TypeScript that is capable of resolving .mjs modules correctly. See TS config compilerOptions.module value nodenext:

Thank you, let me try it. Currently, my app still cannot resolve the *.mjs module.

{
  "compilerOptions": {
    "target": "esnext",
    "module": "ESNext"
  }
}

[giautm]

I'm unable to use nodenext for RN project. So, I think I have to downgrade to version 11. T_T