Help: Can't do an absolute import of a TypeScript file from a JS file

Expo SDK
1

Please provide the following:

  1. SDK Version: latest
  2. Platforms(ios/android/both): both

When publishing our app, we are encountering an error:

Unable to resolve module `util/ApiClient` from `foobar/middleware/ClientMiddleware.js`: Module `util/ApiClient` does not exist in the Haste module map

This line: import { client } from 'util/ApiClient'; is used inside a Javascript file, and ApiClient is a TS file.

It works fine in development, just fails when building/publishing.

One thing to note: the publish works when explicitly specifying the file extension: import { client } from 'util/ApiClient.ts';

Tsconfig.json:

{
  "compilerOptions": {
    "allowSyntheticDefaultImports": true,
    "jsx": "react-native",
    "lib": ["dom", "esnext"],
    "moduleResolution": "node",
    "allowJs": true,
    "noEmit": true,
    "skipLibCheck": true,
    "resolveJsonModule": true,
    "esModuleInterop": true,
    "baseUrl": "./",
    "paths": {
      "util/*": ["util/*"]
    }
  },
  "exclude": ["node_modules"]
}

babel.config.js

module.exports = (api) => {
  api.cache(true);
  return {
    presets: ['babel-preset-expo', '@babel/typescript'],
    env: {
      development: {
        plugins: ['@babel/transform-react-jsx-source'],
      },
      production: {
        plugins: ['transform-remove-console'],
      },
    },
    plugins: [
      [
        'module-resolver',
        {
          root: ['./'],
          alias: {
            util: './util',
          },
          extensions: ['.js', '.jsx', '.es', '.es6', '.mjs', '.ts', '.tsx'],
        },
      ],
    ],
  };
};
2

This topic was automatically closed 15 days after the last reply. New replies are no longer allowed.