vercel / vercel/next.js

The development mode no longer works with a library imported via Yalc

Open
#35,110 21 comments 6 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
JavaScript
Stars
142k
Forks
32.4k
Avg merge
2d 14h
Merged PRs (30d)
351

Description

Verify canary release
  • I verified that the issue exists in Next.js canary release
Provide environment information
Operating System:
  Platform: win32
  Arch: x64
  Version: Windows 10 Pro
Binaries:
  Node: 16.13.1
  npm: 8.5.3
  Yarn: 1.22.17
  pnpm: N/A
Relevant packages:
  next: 12.1.0
  react: 17.0.2
  react-dom: 17.0.2
What browser are you using? (if relevant)

No response

How are you deploying your application? (if relevant)

No response

Describe the Bug

Since I use version NextJS "12.1.0", when I launch my application in development mode, I have an error in the server console:

$ next dev
ready - started server on 0.0.0.0:3000, url: http://localhost:3000
info  - Loaded env from C:\dev\dev\XXX\XXX-core\.env.local
info  - Loaded env from C:\dev\dev\XXX\XXX-core\.env
warn  - SWC minify release candidate enabled. https://nextjs.org/docs/messages/swc-minify-enabled
Prepare XXX build client side
Prepare XXX build server side
error - ./.yalc/@XXX/XXX-customers/dist/customers/XXX/index.js
Module parse failed: Cannot use 'import.meta' outside a module (219:16)
File was processed with these loaders:
 * ./node_modules/next/dist/compiled/@next/react-refresh-utils/loader.js
 * ./node_modules/next/dist/build/webpack/loaders/next-swc-loader.js
You may need an additional loader to handle the result of these loaders.
|                 // still a Refresh Boundary later.
|                 // @ts-ignore importMeta is replaced in the loader
>                 import.meta.webpackHot.accept();
|                 // This field is set when the previous version of this module was a
|                 // Refresh Boundary, letting us know we need to check for invalidation or

Note that before I was using version 12.0.4 and that I use yalc link to reference my custom library locally

Expected Behavior

my application launches correctly in development mode (without error) and manages to use my custom library imported with "yalc link"

To Reproduce

Use a next application in version 12.1.0, reference an external NPM library with "yalc link"

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Reproduce the failure with Next.js 12.1.0 using a library referenced through yalc link, starting with next dev. Inspect the reported ./.yalc/@XXX/XXX-customers/dist/customers/XXX/index.js path and the listed React Refresh and next-swc loaders. Done means the development server launches without the import.meta parse error and can use the linked library.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, nextjs
Domain
build-system
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Quiet
Clarity
Mostly clear
Newbie friendliness
45/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.