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.

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

Compile failure with Next app using typescript functions from .ts file #2249

Closed
4 tasks done
tdnl opened this issue Dec 31, 2019 · 8 comments · Fixed by #2276
Closed
4 tasks done

Compile failure with Next app using typescript functions from .ts file #2249

tdnl opened this issue Dec 31, 2019 · 8 comments · Fixed by #2276
Labels
outdated scope: nextjs Issues related to NextJS support for Nx type: bug

Comments

@tdnl
Copy link
Contributor

tdnl commented Dec 31, 2019

Prerequisites

Please answer the following questions for yourself before submitting an issue.
YOU MAY DELETE THE PREREQUISITES SECTION.

  • I am running the latest version
  • I checked the documentation (nx.dev) and found no answer
  • I checked to make sure that this issue has not already been filed
  • I'm reporting the issue to the correct repository (not related to React, Angular or any dependency)

Expected Behavior

Next app page should render using utils functions from a .ts file.

Current Behavior

The page displays a "Failed to compile" error

Failure Information (for bugs)

/Users/thomas/GitHub/myorg/libs/mydirectory/utils/src/lib/mydirectory-utils.ts 1:24
Module parse failed: Unexpected token (1:24)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
> export function random(): number {
|   return Math.round(Math.random() * 10);
| }

Steps to Reproduce

Please provide detailed steps for reproducing the issue.

  1. Generate a Next.js app (nx g @nrwl/next:app myapp)
  2. Generate a utils workspace library (nx g @nrwl/workspace:lib utils --directory=mydirectory)
  3. Implement some utils function with TypeScript types in generated library
  4. Use util function in next app page.

Here is a repository with an example: https://github.com/tdnl/nx-test

After cloning and installing the dependencies, run nx serve myapp to see the error.

Note that if we rename the utils file from .ts to .tsx, the page will load correctly.

Context

Please provide any relevant information about your setup:

  @nrwl/angular : Not Found
  @nrwl/cli : 8.9.0
  @nrwl/cypress : 8.9.0
  @nrwl/eslint-plugin-nx : 8.9.0
  @nrwl/express : Not Found
  @nrwl/jest : 8.9.0
  @nrwl/linter : 8.9.0
  @nrwl/nest : Not Found
  @nrwl/next : 8.9.0
  @nrwl/node : Not Found
  @nrwl/react : 8.9.0
  @nrwl/schematics : Not Found
  @nrwl/tao : 8.9.0
  @nrwl/web : 8.9.0
  @nrwl/workspace : 8.9.0
  typescript : 3.5.3
@Aleksion
Copy link

Aleksion commented Jan 1, 2020

I'm experiencing the exact same thing.... Seems I have to change everything to .tsx files

@FrozenPandaz FrozenPandaz added scope: nextjs Issues related to NextJS support for Nx type: bug labels Jan 3, 2020
@etiennecl
Copy link

I'm also experiencing the same thing. Kind of a bummer has I was starting to migrate our current monorepo project to nx and all our lib files are using .ts

@tdnl
Copy link
Contributor Author

tdnl commented Jan 7, 2020

Finally able to investigate the issue. Seems to be working, that was an easy fix 🙂

@etiennecl
Copy link

Will this be released in patch version soon?

@dacarley
Copy link

dacarley commented Jan 9, 2020

I am also affected by this - what is the ETA for a fix making it into a release?

jaysoo pushed a commit that referenced this issue Jan 14, 2020
#2276)

* fix(nextjs): fix issue where using .ts files in next.js app would result in a compile error

The issue was just a misconfiguration in the next's config.ts file: Webpack was only applying the
babel loader on .tsx files.
The updated regex will now load both .ts and .tsx files.

ISSUES CLOSED: #2249

* cleanup(testing): add missing tests for pull request #2276

Co-authored-by: tdnll <40502786+tdnll@users.noreply.github.com>
@Hemadridasari1505
Copy link

Finally able to investigate the issue. Seems to be working, that was an easy fix 🙂

Your comment doesn't make sense at all unless you let everyone know how did you fix that.

@tdnl
Copy link
Contributor Author

tdnl commented Apr 19, 2022

Finally able to investigate the issue. Seems to be working, that was an easy fix 🙂

Your comment doesn't make sense at all unless you let everyone know how did you fix that.

Have you tried looking at the pull request linked just above the message from 2020?

@github-actions
Copy link

This issue has been closed for more than 30 days. If this issue is still occuring, please open a new issue with more recent context.

@github-actions github-actions bot locked as resolved and limited conversation to collaborators Mar 22, 2023
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
outdated scope: nextjs Issues related to NextJS support for Nx type: bug
Projects
None yet
Development

Successfully merging a pull request may close this issue.

6 participants