nx: TypeScript library not being transpiled when imported from app project

Originally posted in #10584, as I thought it was the same issue:

Current Behavior

When importing a typescript library (in the same monorepo) from an app project using “executor”: “@nrwl/web:webpack”, an error is thrown:

ERROR in ../repro-lib/src/index.ts
Module build failed (from ../../node_modules/@nrwl/web/src/utils/web-babel-loader.js):
SyntaxError: /home/lusito/Code/typescript/repro/packages/repro-lib/src/index.ts: Support for the experimental syntax 'flow' isn't currently enabled (3:8):

  1 | export class Repro {}
  2 |
> 3 | export type Second = {
    |        ^
  4 |     repro: Repro;
  5 | };
  6 |

Using “executor”: “@nrwl/node:webpack” works perfectly fine, but I need it to work with web:webpack…

Expected Behavior

TypeScript is transpiled correctly and no error is thrown.

Steps to Reproduce

Here is the smallest reproduction I could make: https://github.com/Lusito/nx-import-type-repro

Environment

>  NX   Report complete - copy this into the issue template

   Node : 18.1.0
   OS   : linux x64
   npm  : 8.8.0
   
   nx : 14.3.6
   @nrwl/angular : Not Found
   @nrwl/cypress : 14.3.6
   @nrwl/detox : Not Found
   @nrwl/devkit : 14.3.6
   @nrwl/eslint-plugin-nx : Not Found
   @nrwl/express : Not Found
   @nrwl/jest : 14.3.6
   @nrwl/js : 14.3.6
   @nrwl/linter : 14.3.6
   @nrwl/nest : Not Found
   @nrwl/next : Not Found
   @nrwl/node : 14.3.6
   @nrwl/nx-cloud : Not Found
   @nrwl/nx-plugin : Not Found
   @nrwl/react : Not Found
   @nrwl/react-native : Not Found
   @nrwl/schematics : Not Found
   @nrwl/storybook : Not Found
   @nrwl/web : 14.3.6
   @nrwl/workspace : 14.3.6
   typescript : 4.7.4
   ---------------------------------------
   Community plugins:

About this issue

  • Original URL
  • State: closed
  • Created 2 years ago
  • Reactions: 6
  • Comments: 20 (3 by maintainers)

Most upvoted comments

I found the solution in #3184.

I added "presets": ["@nrwl/web/babel"] to the babel.config.json file in the monorepo root, and the issue has been solved.

When I copy the .babelrc file from the app to the lib, the app will build succesfully.

I added “presets”: [“@nrwl/web/babel”] to the babel.config.json file in the monorepo root, and the issue has been solved.

Nothing worked for me.

Here is my smallest reproduction i could make: https://github.com/srn271/nx-test-workspace

I am encountering this error in a react-native project.

Thanks, @exsesx That’s what I ended up doing. But I was hoping to upgrade NX to the latest, maybe when I have a clearer mind 😉

@ossamaweb If I remember correctly, I downgraded Next.js to 13.1, and everything started working fine.

+1, same issue. I have a shared constants TypeScript library, used by the frontend React app and Node.js backend, stuck on building the frontend, getting the error:

Module parse failed: Unexpected token (1:7)
You may need an appropriate loader to handle this file type...